Manipular dois select

[John Hebert Trindade]

Boa tarde a todos,

Tenho um formulário com 3 campos selects, consoante o que selecionar no primeiro gostaria que fosse feito uma pesquisa e preenchido o segundo e assim sucessivamente.

fiz da seguinte forma, mas não resultou.

Alias até funciona se eu digitar directamente na url o seguinte caminho:

"http://projecto/load-concelho/index?distrito=2" no console me devolve correctamente, mas quando tento manipular o select não resulta.

Na linha 6 já tentei:

fetch("LoadConcelhos.php/index?distrito=" + adms_distrito_id)

fetch("LoadConcelhos/index?distrito=" + adms_distrito_id)

fetch("../LoadConcelhos.php/index?distrito=" + adms_distrito_id)

fetch("http://projecto/LoadConcelhos.php/index?distrito=" + adms_distrito_id)

fetch("load-concelhos.php/index?distrito=" + adms_distrito_id)

fetch("../Controllers/LoadConcelhos.php/index?distrito=" + adms_distrito_id)

LoadConcelho.php (2º select)

<?php

namespace App\adms\Controllers;

use PDO;

class LoadConcelhos
{
  public function index()
  {
    $adms_distrito_id = $_GET['distrito'];

    $listConcelhos = new \App\adms\helpers\AdmsRead();
    $listConcelhos->fullRead("SELECT id, name_concelho FROM adms_concelhos WHERE adms_distrito_id=:adms_distrito_id ORDER BY name_concelho ASC", "adms_distrito_id={$adms_distrito_id}");
    $registry = $listConcelhos->getResult();

    foreach ($registry as $concelhos) {
?>
      <option value="<?php echo $concelhos['id'] ?>" <?php echo $concelhos['name_concelho'] ?>></option>
<?php
    }
  }
}

concelho.js

1 const selectDistrito = document.getElementById('adms_distrito_id')

2 selectDistrito.onchange = () => {
3  const selectConcelho = document.getElementById('adms_concelho_id')
4  const adms_distrito_id = selectDistrito.value;
5  console.log(adms_distrito_id);
6  fetch("LoadConcelhos.php/index?distrito=" + adms_distrito_id)
7    .then(response => {
8      return response.concelhos();
9    })
10    .then(bodyContent => {
11      selectConcelho.innerHTML = bodyContent;
12    });
13 }

 

 

[John Hebert Trindade]

esqueci de dizer que dá o seguinte erro:

concelho.js:9 Uncaught (in promise) TypeError: response.concelhos is not a function
    at custom_autarquia.js:9:23

[Ivo Vicente]

Boa noite, 

O erro na linha 9 diz logo o motivo, o concelhos não é uma função return response.concelhos();  Remove os parentesis.

E em principio logo no primeiro .then podes fazer logo a atribuição do bodyContent ao selectConcelho.innerHTML

Nada como validar a resposta com debug ou com o sempre à mão console.log

[John Hebert Trindade]

Olá Ivo e na linha 6 do arquivo js qual uso?

o exemplo que vi o arquivo js estava na raiz, já o meu está na pasta controllers

Edited October 15, 2023 at 10:20 PM by John Hebert Trindade

[Ivo Vicente]

Respondi pela mensagem de erro

concelho.js:9 Uncaught (in promise) TypeError: response.concelhos is not a function
    at custom_autarquia.js:9:23

Linha 9 do ficheiro custom_autarquia.js

[John Hebert Trindade]

ok, desculpe me, pensei que poderia saber.

[Ivo Vicente]

Mas a minha explicação ajudou a resolver?