Dificuldade do php pegar texto do select alimentado com javascript e json
29/10/2019
0
Mas no form html este preenche o value com valor do ID no json. E se mudar não funciona o select.
HtmlOption += '<option value="' + select.id + '">' + select.name + '</option>';
Obs.: código completo do js mais embaixo
Como faço para o php pegar o texto?
Form html
<div class="form-group" role="select"> <label for="regioes">Região de integração</label> <select name="regioes" id="regioes"> <option value="">Selecione a regição</option> </select> </div> <div class="form-group" role="selecet"> <!-- selecionar o programa --> <label for="programas">Programa desenvolvido</label> <select name="programas" id="programas"> <option value="">Selecione o programa</option> </select> </div>
Arquivo: alimentar-combos-regiao-programas-municipio.js
function get_json_data(id, parent_id) { var HtmlOption = ''; $.getJSON('SIGPLAM4/javaScript/lista-regiao-programas-municipio.json', function(data){ ListSelect = id; // ID do select regioes do form html HtmlOption += '<option value="">Selecione a ' + ListSelect + '</option>'; // alimenta o objeto select usando each e, uma função anônima de callback (índice do objeto e o objeto) $.each(data, function(key, select) { if(select.parent_id == parent_id) { HtmlOption += '<option value="' + select.id + '">' + select.name + '</option>'; } }); $('#' + id).html(HtmlOption); // envia as opções do select do arquivo json ao form html }); } get_json_data('regioes', 0); $(document).on('change', '#regioes', function(){ // quando uma opção é selecionada no select regioes, alimenta os outros selects do form var regioes_id = $(this).val(); if (regioes_id != ''){ get_json_data('programas', regioes_id); get_json_data('municipio', category_id); get_json_data('municipioSuas', category_id); get_json_data('municipioVig', category_id); } else { $('#programas').html('<option value="">Selecione o programa</option>'); } }); $(document).on('change', '#programas', function(){ var category_id = $(this).val(); if (category_id != '') { get_json_data('municipio', category_id); get_json_data('municipioSuas', category_id); get_json_data('municipioVig', category_id); } else { $('#municipio').html('<option value="">Selecione o municipio</option>'); $('#municipioSuas').html('<option value="">Selecione o municipio SUAS</option>'); $('#municipioVig').html('<option value="">Selecione o municipio VIG</option>'); } });
Arquivo lista-regiao-programas-municipio.json
[ { "id":"1", "name":"Araguaia", "parent_id":"0" }, { "id":"2", "name":"Baixo Amazonas", "value":"Baixo Amazonas", "parent_id":"0" }, { "id":"3", "name":"Carajás", "parent_id":"0" }, { "id":"4", "name":"Programa 1", "parent_id":"1" }, { "id":"5", "name":"Programa 2", "parent_id":"1" }, { "id":"6", "name":"Programa 3", "parent_id":"1" }, { "id":"7", "name":"Agua Azul do Norte", "parent_id":"4" }, { "id":"8", "name":"Bannach", "parent_id":"4" }, { "id":"9", "name":"Conceição do Araguaia", "parent_id":"4" }, { "id":"10", "name":"Agua Azul do Norte", "parent_id":"5" }, { "id":"11", "name":"Bannach", "parent_id":"5" }, { "id":"12", "name":"Conceição do Araguaia", "parent_id":"5" } ]
Um simples PHP
if (isset($_POST['regioes']) ? $_POST['regioes'] : null){
Liclopes
Posts
30/10/2019
Alex William
Bom, primeiro acredito que voce tenha que mudar:
'<option value="' + select.id + '">' + select.name + '</option>';
por:
'<option value="' + select.value + '">' + select.name + '</option>';
E em segundo, no seu JSON, somente 1 valor(Baixo Amazonas) tem atributo value, quando o JS tentar buscar esse valor em um "nó" do JSON que não tem esse atributo, ele retornara erro de referencia nula, deixe seu JSON assim:
[ { "id":"1", "name":"Araguaia", "value":"", "parent_id":"0" }, { "id":"2", "name":"Baixo Amazonas", "value":"Baixo Amazonas", "parent_id":"0" }, { "id":"3", "name":"Carajás", "value":"", "parent_id":"0" }, { "id":"4", "name":"Programa 1", "value":"", "parent_id":"1" }, { "id":"5", "name":"Programa 2", "value":"", "parent_id":"1" }, { "id":"6", "name":"Programa 3", "value":"", "parent_id":"1" }, { "id":"7", "name":"Agua Azul do Norte", "value":"", "parent_id":"4" }, { "id":"8", "name":"Bannach", "value":"", "parent_id":"4" }, { "id":"9", "name":"Conceição do Araguaia", "value":"", "parent_id":"4" }, { "id":"10", "name":"Agua Azul do Norte", "value":"", "parent_id":"5" }, { "id":"11", "name":"Bannach", "value":"", "parent_id":"5" }, { "id":"12", "name":"Conceição do Araguaia", "value":"", "parent_id":"5" } ]
Verifique se dessa forma funciona.
Espero ter ajudado. :D
30/10/2019
Liclopes
Bom, primeiro acredito que voce tenha que mudar:
'<option value="' + select.id + '">' + select.name + '</option>';
por:
'<option value="' + select.value + '">' + select.name + '</option>';
Já tentei fazer isso, retirando o "select.id" da erro... onde o select "programas" não é alimentado, as opções do arquivo json não aparecem.
E se mudar não funciona o select.
[code=js]
$(document).on('change', '#regioes', function(){ // quando uma opção é selecionada no select regioes, alimenta os outros selects do form
var regioes_id = $(this).val();
if (regioes_id != ''){
get_json_data('programas', regioes_id);
get_json_data('municipio', category_id);
get_json_data('municipioSuas', category_id);
get_json_data('municipioVig', category_id);
} else {
$('#programas').html('<option value="">Selecione o programa</option>');
}
});
[/code=js]
30/10/2019
Liclopes
'<option value="' + select.id + '">' + select.name + '</option>';
por:
'<option value="' + select.value + '">' + select.name + '</option>';
Já tentei fazer isso, retirando o "select.id" da erro no javascript e no selet "programas".
O php salva corretamente o value do select "regioes" (texto "Araguaia"), mas os dados do select "programas" não aparecem que estão no json.
14/11/2019
Liclopes
Ao escolher no select "regioes" alimenta o select "programas" com getjson:
$(document).ready(function(){ $.getJSON('SIGPLAM4/javaScript/lista-regiao-programas.json', function(data){ var items = []; var options = '<option value="">escolha um estado</option>'; $.each(data, function(key, val){ options += '<option value="' + val.nome + '">' + val.nome + '</option>'; }); $("#regioes").html(options); $("#regioes").change(function(){ var options_cidades = ''; var str = ""; $("#regioes option:selected").each(function(){ str += $(this).text(); }); $.each(data, function(key, val){ if(val.nome == str){ $.each(val.cidades, function (key_city, val_city){ options_cidades += '<option value="' + val_city + '">' + val_city + '</option>'; }); } }); $("#programas").html(options_cidades); }).change(); }); });
Também ao escolher no select "regioes" alimenta o select "municipio" com switch case arcaico:
function dynamicdropdown(listindex) { switch (listindex) { case "Araguaia" : document.getElementById("municipio").options[0]=new Option("Selecione o município",""); document.getElementById("municipio").options[1]=new Option("Conceição do Araguaia","Conceição do Araguaia"); document.getElementById("municipio").options[2]=new Option("Floresta do Araguaia","Floresta do Araguaia"); document.getElementById("municipio").options[3]=new Option("Santa Maria das Barreiras","Santa Maria das Barreiras"); document.getElementById("municipio").options[4]=new Option("Santana do Araguaia","Santana do Araguaia"); break; case "Baixo Amazonas" : document.getElementById("municipio").options[0]=new Option("Selecione o município",""); document.getElementById("municipio").options[1]=new Option("Município 1","Município 1"); document.getElementById("municipio").options[2]=new Option("Município 2","Município 2"); break; } return true; }
O form select html:
<label for="regioes">Região de integração</label> <select name="regioes" id="regioes" class="form-control" onchange="javascript: dynamicdropdown(this.options[this.selectedIndex].value);"> <option value="">Selecione a regição</option> </select> <label for="municipio">Município de atuação</label> <select name="municipio" id="municipio"> <option value="">Selecione o municipio</option> </select>
Clique aqui para fazer login e interagir na Comunidade :)