LucasMPires Postado Novembro 17, 2011 Denunciar Share Postado Novembro 17, 2011 Bom dia, estou iniciando na programacão, e tenho o seguinte exercício:5. Crie um formulário e insira os seguintes campos abaixo:a) um componente 'select', com os estados (rs,sc,pr).B) outro componente 'select' com as cidades desses estados.Crie então uma função que ao selecionar um estado, seja populado o segundo componente,com algumas cidades desse estado.Ex. Select1 (valor escolhido= RS) - Select1 (valores apresentando= Porto Alegre, CAnoas, Gravatai).O problema, é que não sei como vou fazer a funcão para popular o segundo select.<html><body><br><br><br><br><br><br><br><form name='e'>ESCOLHA UM ESTADO:<br><select onchange='validacidade()'><option>RS <value="RS"></option><option>SC <value="SC"></option><option>PR <value="PR"></option></select><br><br><br>ESCOLHA A CIDADE:<br><select><option></option><option></option><option></option></select></form><script>function validacidade(){var estado = document.forms["e"].estado.value;if(estado = option.value"RS"){<select name="cidade"><option>Porto Alegre</option><option>canoas</option><option>Alvorada</option></select>}}</script></html> Citar Link para o comentário Compartilhar em outros sites More sharing options...
0 Tenko Postado Novembro 17, 2011 Denunciar Share Postado Novembro 17, 2011 Boa tarde.O melhor modo de fazer isso é com AJAX, mas acredito que este modelo te ajude a entender.Deixei tudo com comentários pra ficar fácil de enteder, mas, lembrando, este é um exemplo, procure, pesquise soluções melhores.<html> <head> <title></title> <script> function cidade(estado) { // Criando o array das cidades var aArrayCidade = new Array(); // Adicionando as cidades aArrayCidade['RS'] = new Array('Alecrim','Cacequi','Pinhal Grande'); aArrayCidade['SC'] = new Array('Tubarão', 'Itajaí'); // pega a quantidade de itens do array de cidades do estado var iTamanho = aArrayCidade[ estado ].length; // limpando os campos das cidades document.getElementById('cidade').innerHTML = ''; // Criando e adicionando o primeiro valor oOptions = document.createElement('option'); oOptions.value = ''; oOptions.innerHTML = ':: Selecione ::'; document.getElementById('cidade').appendChild( oOptions ); // percorrendo o array for( var i = 0; i < iTamanho; i++ ) { // criando os objetos options oOptions = document.createElement('option'); oOptions.value = aArrayCidade[ estado ][ i ]; oOptions.innerHTML = aArrayCidade[ estado ][ i ]; // adicionando os elementos document.getElementById('cidade').appendChild( oOptions ); } } </script> </head> <body> <table border="1" cellpadding="1" cellspacing="1" width="40%"> <tr> <td>ESCOLHA UM ESTADO: </td> <td> <select id="estados" onchange="cidade(this.value);"> <option value="">:: Selecione ::</option> <option value="RS">RS</option> <option value="SC">SC</option> </select> </td> </tr> <tr> <td>ESCOLHA A CIDADE: </td> <td> <select id="cidade"> <option value="">:: Selecione ::</option> </select> </td> </tr> </table> </body></html> Citar Link para o comentário Compartilhar em outros sites More sharing options...
0 LucasMPires Postado Novembro 17, 2011 Autor Denunciar Share Postado Novembro 17, 2011 Cara, muito obrigado pela forca!é, eu pesquisei e existem vários jeitos bem mais simples de se fazer isso,mas o problema é que não aprendemos isso ainda, e nosso professor pede para explicar,daí não adianta né.Vou estudar a partir deste código.Muito Obrigado. Citar Link para o comentário Compartilhar em outros sites More sharing options...
0 Tenko Postado Novembro 17, 2011 Denunciar Share Postado Novembro 17, 2011 deixei bem comentado pra você entender passo a passo o que eu fiz Citar Link para o comentário Compartilhar em outros sites More sharing options...
0 Wescley Lopes Postado Março 13, 2012 Denunciar Share Postado Março 13, 2012 deixei bem comentado pra você entender passo a passo o que eu fizAmigo bem legal seu codigo, agora eu to tentando fazer o mesmo só que em 4 select pode me ajudar postando um exemplo, pois com 2 já consegui atraves do seu mas com 4 to batendo cabeça. Citar Link para o comentário Compartilhar em outros sites More sharing options...
Pergunta
LucasMPires
Bom dia, estou iniciando na programacão, e tenho o seguinte exercício:
5. Crie um formulário e insira os seguintes campos abaixo:
a) um componente 'select', com os estados (rs,sc,pr).
B) outro componente 'select' com as cidades desses estados.
Crie então uma função que ao selecionar um estado, seja populado o segundo componente,
com algumas cidades desse estado.
Ex. Select1 (valor escolhido= RS) - Select1 (valores apresentando= Porto Alegre, CAnoas, Gravatai).
O problema, é que não sei como vou fazer a funcão para popular o segundo select.
<html>
<body>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<form name='e'>
ESCOLHA UM ESTADO:<br>
<select onchange='validacidade()'>
<option>RS <value="RS"></option>
<option>SC <value="SC"></option>
<option>PR <value="PR"></option>
</select>
<br>
<br>
<br>
ESCOLHA A CIDADE:<br>
<select>
<option></option>
<option></option>
<option></option>
</select>
</form>
<script>
function validacidade(){
var estado = document.forms["e"].estado.value;
if(estado = option.value"RS"){
<select name="cidade">
<option>Porto Alegre</option>
<option>canoas</option>
<option>Alvorada</option>
</select>
}
}
</script>
</html>
Link para o comentário
Compartilhar em outros sites
4 respostass a esta questão
Posts Recomendados
Participe da discussão
Você pode postar agora e se registrar depois. Se você já tem uma conta, acesse agora para postar com sua conta.