Fóruns sobre PHP, JavaScript, HTML, MySQLi, jQuery, Banco de Dados, CSS


Moderador: web

 
Avatar do usuário
ADMIN
ADMIN
Tópico Autor
Mensagens: 17523
Nome: Kleber
Descrição do site: Onde você encontra scripts grátis para o seu site
Sexo: Masculino
Localização: RJ / RJ / Brasil
Contato:

Carregar select option baseado em outro jquery

26-08-2012 21:49

Essa é uma dica para quem quer carregar opções em um select baseado em outro select. Por exemplo, você seleciona um estado, e lista a cidade do estado.

O funcionamento do script é bem simples. Tem um arquivo com 2 selects, um com as opções a ser escolhida, e outro vazio, sem options.

Usando o $.post, um documento outro é carregado, esse outro documento vai gerar options, por exemplo:

<option>...</option> <option>...</option> <option>...</option>

Essas options vão entrar no select que está vazio, no documento principal.

Nesse caso, para gerar as options, você vai ter que ter uma consulta MySQL e no while você irá gerar o resultado no formato de option, ex.:

echo "<option value='$coluna'>$coluna</option>"; 

Para testar, crie um documento chamado teste.php e coloque o seguinte:

<script src="jquery.js"></script>   <script> $(document).ready(function() {   $("select[name=select1]").change(function(){ $("select[name=select2]").html('<option value="">aguarde...</option>'); $.post("teste2.php", {valor:$(this).val()}, function(valor){ $("select[name=select2]").html(valor); } ) })                                }); </script>


<select name="select1"> <option>selecione</option> <option value="1">1</option> </select>   <select name="select2"> </select>

É necessário o jquery.js na mesma pasta

Para teste, crie um arquivo chamado teste2.php com o seguinte código

<option>escolha</option> <option>1</option> <option>2</option> <option>3</option>

0
A melhor hospedagem para o seu site HostGator!

Quem está online

Usuários navegando neste fórum: Google [Bot]