Ir para conteúdo

POWERED BY:

Arquivado

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

Myrhay

Ajuda com Combobox Estado/Cidade/Bairro/Ramo

Recommended Posts

Boa tarde Gente, estou com dificuldade com esse combobox, tenho que selecionar o Estado, depois seleciono a cidade, depois o bairro e por ultimo o Segmento

 

Segue o código que uso

 

index.php

<?php

if (file_exists('init.php'))
{
	require_once 'init.php';
}
else
{
	exit('N�o foi poss�vel encontrar o arquivo de inicializa��o');
}
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<script type="text/javascript" src="ajax.js"></script>
<script type="text/javascript" src="funcoes.js"></script>
<title>Cidades | Estados</title>
</head>
<body onload="buscaEstados()">

<form method="post" action="">

    <select name="uf" id="uf" onchange="buscaCidades(this.value)">
    </select>


    <select name="cidade" id="cidade" >
      <option value="">Selecione a Cidade</option>
    </select>
    
     <select name="bairro" id="bairro" >
      <option value="">Selecione o bairro</option>
    </select>
  
  	<select name="ramo" id="ramo" >
      <option value="">Selecione o ramo</option>
    </select>

</form>

</body>
</html>

 

funcoes.php

<?php

if (file_exists('init.php'))
{
	require_once 'init.php';
}
else
{
	exit('N�o foi poss�vel encontrar o arquivo de inicializa��o');
}


$acao = isset($_GET['acao']) ? $_GET['acao'] : FALSE;

header('Content-Type: application/xml');

$xml = "<?xml version='1.0' encoding='iso-8859-1'?>\r\n";


switch ($acao)
{
	case 'buscaEstados':
	    buscaEstados();
	    break;
	case 'buscaCidades':
	    buscaCidades();
	    break;
    case 'buscaBairro':
	    buscaBairro();
	    break;
}


function buscaEstados()
{
	global $xml;
	
	$xml .= '<estados>';
	
	$MySQLi = new MySQLi(BD_SERVIDOR, BD_USUARIO, BD_SENHA, BD_NOME);
	
	$sql = $MySQLi->query('Select * From estados Order By nome ASC');
	
	while ($f = $sql->fetch_object())
	{
		$xml .= '  <estado>';
		$xml .= '    <id>' . $f->id . '</id>';
		$xml .= '    <sigla>' . $f->sigla . '</sigla>';
		$xml .= '    <nome>' . $f->nome . '</nome>';
		$xml .= '  </estado>';
	}
	
	$sql->close();
	$MySQLi->close();
	
	$xml .= '</estados>';
	echo $xml;
}



function buscaCidades()
{
	$uf = isset($_GET['uf']) ? (int)$_GET['uf'] : 1;
	
	global $xml;
	
	$xml .= '<cidades>';
	
	$MySQLi = new MySQLi(BD_SERVIDOR, BD_USUARIO, BD_SENHA, BD_NOME);
	
	$sql = $MySQLi->query('Select id, nome From cidades Where id_uf = ' . $uf . ' Order By nome ASC');
	
	while ($f = $sql->fetch_object())
	{
		$xml .= '  <cidade>';
		$xml .= '    <id>' . $f->id . '</id>';
		$xml .= '    <nome>' . $f->nome . '</nome>';
		$xml .= '  </cidade>';
	}
	
	$sql->close();
	$MySQLi->close();
	
	$xml .= '</cidades>';
	echo $xml;
}



function buscaBairro()
{
	$cidade = isset($_GET['cidade']) ? (int)$_GET['cidade'] : 2;

	global $xml;

	$xml .= '<bairros>';

	$MySQLi = new MySQLi(BD_SERVIDOR, BD_USUARIO, BD_SENHA, BD_NOME);

	$sql = $MySQLi->query('Select * From bairro Where id_cid = ' . $cidade . ' Order By nome ASC');

	while ($f = $sql->fetch_object())
	{
		$xml .= '  <bairro>';
		$xml .= '    <id>' . $f->id . '</id>';
		$xml .= '    <nome>' . $f->nome . '</nome>';
		$xml .= '  </bairro>';
	}

	$sql->close();
	$MySQLi->close();

	$xml .= '</bairros>';
	echo $xml;
}

?>

funcoes.js


function buscaEstados()
{
	var uf = document.getElementById('uf');
	
	var op = document.createElement('option');
    op.setAttribute('value', '');
    op.appendChild(document.createTextNode("Carregando..."));
    uf.appendChild(op);
	
	var ajax = openAjax();
	
	ajax.open('GET', 'funcoes.php?acao=buscaEstados', true);
	
	ajax.onreadystatechange = function()
	{
		if (ajax.readyState == 4)
		{
			if (ajax.status == 200)
			{
				uf.innerHTML = '';
				
				var opcao = document.createElement('option');
				opcao.setAttribute('value', '');
				opcao.appendChild(document.createTextNode('Selecione o Estado'));
				uf.appendChild(opcao);
				
				var xml = ajax.responseXML;
				var estado = xml.getElementsByTagName('estado');
				
				for (var i = 0; i < estado.length; i++)
				{
					var idEstado = estado[i].getElementsByTagName('id')[0].firstChild.nodeValue;
					var siglaEstado = estado[i].getElementsByTagName('sigla')[0].firstChild.nodeValue;
					var nomeEstado = estado[i].getElementsByTagName('nome')[0].firstChild.nodeValue;
					
					var opcao = document.createElement('option');
					opcao.setAttribute('value', idEstado);
					//opcao.appendChild(document.createTextNode(siglaEstado + ' - ' + nomeEstado));
					opcao.appendChild(document.createTextNode(nomeEstado));
					uf.appendChild(opcao);
					
				}
				
			}
		}
	}
    ajax.send(null);
    
}




function buscaCidades(uf)
{

	var cidades = document.getElementById('cidade');
	cidades.innerHTML = '';
	var op = document.createElement('option');
    op.setAttribute('value', '');
    op.appendChild(document.createTextNode("Carregando..."));
    cidades.appendChild(op);
	
	var url = 'funcoes.php?acao=buscaCidades&uf=' + uf;
	var ajax = openAjax();
	
	ajax.open('GET', url, true);
	ajax.onreadystatechange = function()
	{
		if (ajax.readyState == 4)
		{
			if (ajax.status == 200)
			{
				cidades.innerHTML = '';
				

				
				var xml = ajax.responseXML;
				var cidade = xml.getElementsByTagName('cidade');
				
				for (var i = 0; i < cidade.length; i++)
				{
					var idCidade = cidade[i].getElementsByTagName('id')[0].firstChild.nodeValue;
					var nomeCidade = cidade[i].getElementsByTagName('nome')[0].firstChild.nodeValue;
					
					var opcao = document.createElement('option');
					opcao.setAttribute('value', idCidade);
					opcao.appendChild(document.createTextNode(nomeCidade));
					cidades.appendChild(opcao);
				}
			}
		}
	}
	ajax.send(null);
}



function buscaBairro(cidade)
{

	var bairro = document.getElementById('bairro');
	bairro.innerHTML = '';
	var op = document.createElement('option');
    op.setAttribute('value', '');
    op.appendChild(document.createTextNode("Carregando..."));
    bairro.appendChild(op);

	var url = 'funcoes.php?acao=buscaBairro&cidade=' + cidade;
	var ajax = openAjax();

	ajax.open('GET', url, true);
	ajax.onreadystatechange = function()
	{
		if (ajax.readyState === 4)
		{
			if (ajax.status === 200)
			{
				bairro.innerHTML = '';



				var xml = ajax.responseXML;
				var bairro = xml.getElementsByTagName('bairro');

				for (var i = 0; i < bairro.length; i++)
				{
					var idBairro = bairro[i].getElementsByTagName('id')[0].firstChild.nodeValue;
					var nomeBairro = bairro[i].getElementsByTagName('nome')[0].firstChild.nodeValue;

					var opcao = document.createElement('option');
					opcao.setAttribute('value', idBairro);
					opcao.appendChild(document.createTextNode(nomeBairro));
					bairro.appendChild(opcao);
				}
			}
		}
	}
	ajax.send(null);
}

 

Se puderem me ajudar agradeço muito.

 

Compartilhar este post


Link para o post
Compartilhar em outros sites

Qual seria a dificuldade que você está tendo?

O Que está funcionando e o que não está até o momento?

Compartilhar este post


Link para o post
Compartilhar em outros sites

No caso 

5 horas atrás, RodriAndreotti disse:

Qual seria a dificuldade que você está tendo?

O Que está funcionando e o que não está até o momento?

No caso conseguir fazer até a cidade, quando utilizo para o bairro e ramo já não funciona, não consigo ver se o erro é no codigo.

Compartilhar este post


Link para o post
Compartilhar em outros sites
7 horas atrás, RodriAndreotti disse:

Mas qual o erro que ocorre quando você executa?
Tentou debugar no firebug?

Opa boa tarde, depois de muito mexer, verifiquei esse erro 

Uncaught TypeError: Cannot set property 'innerHTML' of undefined
    at XMLHttpRequest.ajax.onreadystatechange

O que poderia ser?

Segue o código  e é justamente no bairro.innerHTML = '';

function buscaBairro(cidade)
{

	var bairro = document.getElementById('bairro');
	bairro.innerHTML = '';
	var op = document.createElement('option');
    op.setAttribute('value', '');
    op.appendChild(document.createTextNode("Carregando..."));
    bairro.appendChild(op);

	var url = 'funcoes.php?acao=buscaBairro&cidade=' + cidade;
	var ajax = openAjax();

	ajax.open('GET', url, true);
	ajax.onreadystatechange = function()
	{
		if (ajax.readyState == 4)
		{
			if (ajax.status == 200)
			{
				bairro.innerHTML = '';
				var xml = ajax.responseXML;
				var bairro = xml.getElementsByTagName('bairro');

				for (var i = 0; i < bairro.length; i++)
				{
					var idBairro = bairro[i].getElementsByTagName('id')[0].firstChild.nodeValue;
					var nomeBairro = bairro[i].getElementsByTagName('nome')[0].firstChild.nodeValue;

					var opcao = document.createElement('option');
					opcao.setAttribute('value', idBairro);
					opcao.appendChild(document.createTextNode(nomeBairro));
					bairro.appendChild(opcao);
				}
			}
		}
	}
	ajax.send(null);
}

 

Compartilhar este post


Link para o post
Compartilhar em outros sites

Então... o próprio erro está te dizendo o problema.

Uncaught TypeError: Cannot set property 'innerHTML' of undefined

 

Ele diz que você está setando a propriedade innerHTML de uma variável que não foi definida ainda.

Observe este trecho:

bairro.innerHTML = '';
var xml = ajax.responseXML;
var bairro = xml.getElementsByTagName('bairro');

Veja que você seta o innerHTML do bairro antes de declarar a variável bairro, então você está tentando acessar uma variável que ainda não existe.

 

Compartilhar este post


Link para o post
Compartilhar em outros sites

Seu problema não é com PHP. Vou mover para área correta. Ainda na oportunidade, vide os tópicos:

 

ATENÇÃO: Seu problema é realmente com o PHP ?

Compartilhar este post


Link para o post
Compartilhar em outros sites

  • Conteúdo Similar

    • Por ILR master
      Tudo bem pessoal?
       
      No código abaixo, estou fazendo uma consulta nas tabelas, banners e banners_referencia
      Meu objetivo é trazer resultados com valores iguais ao nome da cidade declarada na $cidade ou resultados com a referencia Total.
      O problema é que está trazendo todos os resultados. Tenho 10 linhas, 1 com o nome da cidade e duas com o valor Total, então o resultado teria que ser de apenas 3 linhas, mas mostra tudo.
       
      $banner = "SELECT A.*, B.* FROM banners A, banners_referencia B WHERE B.cod_referencia = A.cod_referencia AND A.cidade = '$cidade' OR B.referencia = 'Total' ORDER BY RAND()";
      $banner = mysqli_query($conexao, $banner) or die ("Banner não encontrado");
      while($busca= mysqli_fetch_array($banner)){
          print $busca['cidade'].'<br>';
      };
       
      Alguém consegue me ajudar?
    • Por Rafael_Ferreira
      Não consigo carregar a imagem do captcha do meu formulário. Foi testado com o xampp e easyphp. Também não carregou a imagem de outros captcha. 
       
       
    • Por luiz monteiro
      Olá.
      Estou atualizando meu conhecimento com Front-End e me deparei com o seguinte problema.
      Criei um sistema para fazer o upload de imagens e alguns campos text.
      Algo bem simples para depois começar a estudar javascript para mostrar a miniatura....
      Mas quando saio do navegador Chrome ou da aba por mais de 3 minutos, ao retornar o navegador as vezes atualiza ou nem chega atualizar mas limpa os campos.
      Estou usando um Smart Motorola com Android, mas um amigo testou no iPhone e acontece a mesma coisa.
      Gostaria de saber se há como usar javascript para evitar isso?
      Agradeço desde já.

      <!DOCTYPE html>
      <html>
      <head>
          <meta charset="utf-8">
          <meta name="viewport" content="width=device-width, initial-scale=1">
          <title>Uploader</title>
      </head>
      <body>
          <form action="?" method="post" enctype="multipart/form-data">
              <br><br>
              <div>selecione a imagem 1</div>
              <input type="file" name="foto1" accept="image/*">
              <br><br>
              <input type="text" name="nome_imagem1">
              
              <br><br>
              <input type="file" name="foto2" accept="image/*">
              <br><br>
              <input type="text" name="nome_imagem2">
              
              <br><br>

              <input type="file" name="foto3" accept="image/*">
              <br><br>
              <input type="text" name="nome_imagem3">
              
              <br><br>
              <input type="submit" value="Enviar">
              <br><br>
          </form>
      <?php
      if ($_SERVER['REQUEST_METHOD'] == 'POST')
      {
          vardump ($_FILES);
      }
      ?>
      </body>
      </html>
       
       
       
    • Por belann
      Olá!
       
      Estou usando o nextjs versão 15.2.3 e criei uma navbar que quando é carregado o programa aparece com a home, mas na hora de clicar na página produtos desaparece a navbar.
      A navbar esta sendo chamada no layout.tsx estou usando typescript
      e fica dessa forma
      <div>           <Navbar/>             <main>{children}</main>             </div>  
    • Por luiz monteiro
      Olá, tudo bem?
       
      Estou melhorando meu conhecimento em php e mysql e, me deparei com o seguinte. A tabela da base de dados tem um campo do tipo varchar(8) o qual armazena números. Eu não posso alterar o tipo desse campo. O que preciso é fazer um select para retornar o números que contenham zeros a direita ou a esquerda.
      O que tentei até agora
       
      Ex1
      $busca = $conexao->prepare("select campo form tabela where (campo = :campo) ");
      $busca->bindParam('campo', $_REQUEST['campo_form']);
       
      Se a direita da string $_REQUEST['campo_form'] termina ou inicia com zero ou zeros, a busca retorna vazio.
      Inseri dados numéricos, da seguinte maneira para testar: 01234567;  12345670: 12345678: 12340000... entre outros nessa coluna. Todos os valores que não terminam ou não iniciam com zero ou zeros, o select funciona.
       
       
      Ex2
      $busca = $conexao->prepare("select campo form tabela where (campo = 0340000) ");
      Esse número está cadastrado, mas não retorna.
       
      Ex3
      $busca = $conexao->prepare("select campo form tabela where (campo = '02340001' ) ");
      Esse número está cadastrado, mas não retorna.
       
       
      Ex4
      $busca = $conexao->prepare("select campo form tabela where (campo like 2340000) ");
      Esse número está cadastrado, mas não retorna.
       
      Ex5
      $busca = $conexao->prepare("select campo form tabela where (campo like '12340000') ");
      Esse número está cadastrado, mas não retorna.
       
      Ex6
      $busca = $conexao->prepare("select campo form tabela where (campo like '"12340000"' ) ");
      Esse número está cadastrado, mas não retorna.
       
       
      Ex7
      $busca = $conexao->prepare("select campo form tabela where (campo like :campo) ");
      $busca->bindParam('campo', $_REQUEST['campo_form'])
      Não retorna dados.
       
      O  $_REQUEST['campo_form'] é envio via AJAX de um formulário. 
      Usei o gettype para verificar o post, e ele retorna string.
      Fiz uma busca com número 12345678 para verificar o que o select retorna, e também retrona como string.
       
      Esse tipo de varchar foi usado porque os números que serão gravados nesse campo,  terão zeros a direita ou na esquerda. Os tipos number do mysql não gravam zeros, então estou usando esse. O problema é a busca.
      Agradeço desde já.
       
       
×

Informação importante

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