Ir para conteúdo

POWERED BY:

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

twpesquisa

[Resolvido] Combobox Estado / Cidade / Bairro

Por , em Javascript

Recommended Posts

twpesquisa    1

twpesquisa
Postado

Pessoal,

 

estou criando um site de imóveis e no mecanismo de busca na pagina princiapl, gostaria de colocar aqueles combobox:

 

> Selecione o estado

> Selecione a cidade

> selecione o bairro

 

 

Conforme a seleção, vai exibindo o que existe associado.

 

Na verdade, minha dúvida é como montar esse "relacionamento" entre os combos, pois as tabelas e os selects eu sei montar.

 

 

Alguem pode me ajudar ?

Compartilhar este post

Link para o post
Compartilhar em outros sites

Rafael Rosario    4

Rafael Rosario
Postado

Eu tenho um código que lista somente as cidades e estados. É uma código do google, mais talvez possa ter dar uma luz.

 

O que falta é somente o Bairro, para atender sua necessidade.

 

 

 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Cidade/Estado</title>
<script type="text/javascript" src="http://cidades-estados-js.googlecode.com/files/cidades-estados-v0.2.js"></script>
</head>

<body>


<script type="text/javascript">
window.onload = function() {
new dgCidadesEstados(document.getElementById('estado'), document.getElementById('cidade'), true);
}
</script>


<select id="estado" name="estado"></select>

<select id="cidade" name="cidade"></select>


</body>

</html>

 

 

Boa sorte.

 

Abrass

Compartilhar este post

Link para o post
Compartilhar em outros sites

twpesquisa    1

twpesquisa
Postado

Esse do Google é bem interessante. Mas gostaria de montar minha propria base.

Sim, poderia ser em AJAX.

 

Como é feito ?

Compartilhar este post

Link para o post
Compartilhar em outros sites

André Severino    3

André Severino
Postado

maliotti na verdade tudo isso é @json, então você teria que montar assim a lógica:

 

- A pessoa seleciona o combo estado, você pega o valor via $_POST com o evento ONCHANGE, e retorna os valores para popular a cidade;

- A pessoa seleciona a cidade, você pega o valor ....... e popula o combo BAIRRO

 

O relacionamento seria feito através do value do select :thumbsup:

Compartilhar este post

Link para o post
Compartilhar em outros sites

André Severino    3

André Severino
Postado

kkkkk

 

Exatamente isso, perceba que ele pega todos os valores pelo .change e tals, desta forma mesmo, a unica diferença é que você vai ter um terceiro valor ali enviando para o back end (php) :P

 

Tenta fazer ae, qualquer coisa poste o codigo :thumbsup:

 

Mas na verdade a duvida em si + javascript do que php

Compartilhar este post

Link para o post
Compartilhar em outros sites

twpesquisa    1

twpesquisa
Postado

Beleza. Vou colocar em pratica, mas percebi que é bem fácil.

Obrigado pela orientação.

Compartilhar este post

Link para o post
Compartilhar em outros sites

twpesquisa    1

twpesquisa
Postado

Acho que me atrapalhei... Vejam o que eu fiz:

 

<script type="text/javascript">
     	$(document).ready(function(){   
        	$("select[name=estado]").change(function(){
           	$("select[name=cidade]").html('<option value="0">Carregando...</option>');

           	$.post("cidades.php",
                 	{estado:$(this).val()},
                 	function(valor){
                    	$("select[name=cidade]").html(valor);
                 	}
                 	)

			//Inicio - Inserido por Julio Malliotti
			$("select[name=bairro]").html('<option value="0">Carregando...</option>');        	
			$.post("bairros.php",
                 	{bairro:$(this).val()},
                 	function(valor){
                    	$("select[name=bairro]").html(valor);
                 	}
                 	)				
			//Fim - Inserido por Julio Malliotti
        	})
     	})

</script>

 

Este codigo esta funcionando perfeitamente, peguei desse site ( http://www.mxmasters.com.br/video-aulas/php/php-combo-dinamico-com-php-e-jquery/ ) e com a idéia existente, gostaria de acrescentar a parte de bairros. Nesta caso, acrescentei o seguinte trecho:

 

 

			//Inicio - Inserido por Julio Malliotti
			$("select[name=bairro]").html('<option value="0">Carregando...</option>');        	
			$.post("bairros.php",
                 	{bairro:$(this).val()},
                 	function(valor){
                    	$("select[name=bairro]").html(valor);
                 	}
                 	)				
			//Fim - Inserido por Julio Malliotti

 

 

tenho o arquivo bairros.php, testei o mesmo e esta funcionando. Somente não esta carregando no combo bairro. Alguem sabe me dizer o porque ?

 

Pessoal!

 

Conseguri resolver. Abaixo segue o código:

 

<script type="text/javascript">
     	$(document).ready(function(){   
        	$("select[name=estado]").change(function(){
           	$("select[name=cidade]").html('<option value="0">Carregando...</option>');
           	$.post("cidades.php",
                 	{estado:$(this).val()},
                  	function(valor){
                     	$("select[name=cidade]").html(valor);
                 	}
                 	)
        	})

        	$("select[name=cidade]").change(function(){
           	$("select[name=bairro]").html('<option value="0">Carregando...</option>');
           	$.post("bairros.php",
                 	{cidade:$(this).val()},
                  	function(valor){
                     	$("select[name=bairro]").html(valor);
                 	}
                 	)
        	})			 
     	})
</script>

Compartilhar este post

Link para o post
Compartilhar em outros sites
Ir para a lista de tópicos Javascript
×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.

  Aceito