[Resolvido] Prenchendo select a partir do banco

[Tuk 0]

Bem, estou desenvolvendo um site pra um imobiliaria, só que na hora de preencher o select com os bairros, partindo do banco de dados, os dados dos bairros que tem acento estão vindo distorcidos, trocando caracteres especiais por "?", e também não está funcionando no IE.

 

Meu código:

FORMULARIO

Selecione a cidade:<br>
              <select name="cidade" id="cidade"> 
              <option value="">Escolha uma cidade</option>
                                            <? include "classe-cidade.php" ;


	                                           $sql_cidade = mysql_query("SELECT * FROM cidade");
	                                           while ($linha_cidade = mysql_fetch_array($sql_cidade))
	                                          {



	                                                        $cidade = new cidade();

	                                                        $cidade->setid($linha_cidade['id']);
	                                                        $cidade->setnome($linha_cidade['nome']);


?>
                    <option value="<? echo $cidade->getid(); ?>"><? echo $cidade->getnome();?></option> 
<? } ?>

       </select> <br /><br /><br />



        Selecione o bairro:<br>
	<select name="bairro" id="bairro">
               <option value="0">Escolha uma cidade</option>
       </select><br /><br /><br />

       <script src="http://www.google.com/jsapi"></script>
	<script type="text/javascript">
	  google.load('jquery', '1.4');
	</script>		
       <script>
       $(document).ready(function(){
           $('#cidade').change(function(){
               $('#bairro').load('bairros.php?bairro='+$('#estados').val() );
           });
       });
	</script>

 

BAIRROS.PHP

<?php
$idbairro = $_GET['bairro'];
include 'config.php';

$result = mysql_query("SELECT * FROM `bairro` WHERE cidade = ".$idbairro." ORDER BY nome");
while($row = mysql_fetch_array($result) ){
    utf8_decode($result);
   echo "<option value='".$row['id']."'>".$row['nome']."</option>";
}
?>

 

O que posso fazer diferente para solucionar meus problemas ?

 

 

Obrigado

[William Bruno 1501]

qual codificação está usando ? ISO ? ou UTF8 ?

 

escolha uma delas, e padronize em tudo.

no banco, no html, na codificação do arquivo...

[Tuk 0]

<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1,utf-8" />

 

No banco seria a collation ?

 

 

E porque será que não funciona no IE ?

[William Bruno 1501]

cara, ou é um ou é outro.. nunca vi dessa forma, com 2 charsets no html.

 

sim, do banco estou falando do collation.

pesquise sobre esse assunto no fórum de php.

[Tuk 0]

no banco está utf8_general.

 

Já pesquisei(pelo google) sobre isso, e o que achei foi colocar esses dois charsets, pois assim, o que já está no html usa caracteres especiais (ç) e o que vem do banco não é necessário isso pode se escrever normal. Acho que é isso.

 

Tem como mudar o collation do banco inteiro ? é Mysql pelo PhpMyadmin

 

Obrigado

[William Bruno 1501]

okay, deixe o banco em utf8_general

agora altere o charset para:

 

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

depois disso, abre o arquivo no teu editor, e escolha a opção: Salvar SEM BOM

[Tuk 0]

Unica coisa que mudou, é que agora os dados de todas as tabelas em todas as páginas ficam com caracteres especiais == "?"

 

Não sei o que pode ser.

[William Bruno 1501]

coloque o seguinte no inicio de um dos arquivos problemáticos:

 

header ('Content-type: text/html; charset=utf-8');

irá resolver.

 

Se ainda continuar com erro, revise os passos.

[Tuk 0]

fiz esse header mais com charset=ISO-8859-1, antes de ler sua resposta aqui, e funcionou .

 

 

O único problema agora é que não funciona no IE, ele deixa o select em branco quando acontece o evento change. Pensei que o Jquery 1.4 funcionava no IE

[William Bruno 1501]

o jQuery funciona sim, desde que você faça da forma correta.

Essa forma:

 $('#bairro').load('bairros.php?bairro='+$('#estados').val() );

não é aconselhavel.

 

veja uma forma melhor e mais bonita de fazer:

http://forum.imasters.com.br/index.php?/topic/365795-combos-dependentes-ajax-jquery/

[Tuk 0]

Bem, fiz como esta no link que você me passou. Porém não acontece nada ao selecionar a cidade.

Debuguei como você orienta no link, o resultado foi:

 

Notice: Undefined variable: campo in , 38 vezes (o numero de registros da tabela),

E abaixo os dados da tabela, com nome e id.

 

meu function.inc.php

<?php
       header("Content-Type: text/html; charset=ISO-8859-1");

       function intGet( $campo ){
               return isset( $_GET[$campo] ) ? (int)$_GET[$campo] : 0;
       }       
       function retorno( $id )
       {
               $sql = "SELECT `id`, `nome` 
                       FROM `bairro` 
                       WHERE `cidade` = '$id' ORDER BY `nome` ;";



               include "config.php";



               $q = mysql_query( $sql );


               $json = ' [';

               if( mysql_num_rows( $q ) > 0 )
               {


                       while( $dados = mysql_fetch_assoc( $q ) )
                       {

                               $json .= '{"nome'.$campo.'":"'.$dados['nome'].'","id'.$campo.'":"'.$dados['id'].'"}, ';
                       }
               }
               else
                       $json .= '{"nome'.$campo.'": "Não Encontrado"}';

               $json .= ']';

               return $json;
       }

       echo retorno( intGet('idCombo1') );
?>

 

script

   <script type="text/javascript" src="js/jquery.js"></script>	
       <script type="text/javascript">
       $(document).ready(function(){//inicio o jQuery
               $("select[name='cidades']").change(function(){
               var idCombo1 = $(this).val();//pegando o value do option selecionado
               //alert(idCombo1);//apenas para debugar a variável

                       $.getJSON(//esse método do jQuery, só envia GET
                               'function.inc.php',//script server-side que deverá retornar um objeto jSON
                               {idCombo1: idCombo1},//enviando a variável

                               function(data){
                               alert(data);//apenas para debugar a variável

                                       var option = new Array();//resetando a variável

                                       resetaCombo('combo2');//resetando o combo
                                       $.each(data, function(i, obj){

                                               option[i] = document.createElement('option');//criando o option
                                               $( option[i] ).attr( {value : obj.id} );//colocando o value no option
                                               $( option[i] ).append( obj.nome );//colocando o 'label'

                                               $("select[name='bairros']").append( option[i] );//jogando um à um os options no próximo combo
                               });
                       });
               });
       });     

       /* função pronta para ser reaproveitada, caso queira adicionar mais combos dependentes */
       function resetaCombo( el )
       {
               $("select[name='"+el+"']").empty();//retira os elementos antigos
               var option = document.createElement('option');                                  
               $( option ).attr( {value : '0'} );
               $( option ).append( 'Escolha' );
               $("select[name='"+el+"']").append( option );
       }
       </script>

 

 

Li varias vezes código, não sei se esqueci de mudar algo,conferi o nome dos selects

 

 

Obrigado

[William Bruno 1501]

troca:

 

                                $json .= '{"nome'.$campo.'":"'.$dados['nome'].'","id'.$campo.'":"'.$dados['id'].'"}, ';
                       }
               }
               else
                       $json .= '{"nome'.$campo.'": "Não Encontrado"}';

por:

 

                                $json .= '{"nome":"'.$dados['nome'].'","id":"'.$dados['id'].'"}, ';
                       }
               }
               else
                       $json .= '{"nome": "Não Encontrado"}';

[Tuk 0]

Obrigado pelas resposta William, desculpa a insistência mais peço que continue me ajudando.

 

O que está ocorrendo agora, é que quando ele quando não existem registros para colocar no select, ele da 3 alerts dizendo "[Object object]" e adiciona 3 vezes "Não Encontrado" no Select,

e quando existem registro para colocar no select, ele não faz nada, não se adiciona nada no select.

 

 

Obrigado

[William Bruno 1501]

poste o teu código atual completo.

 

html, js e php.

[Tuk 0]

js

   <script type="text/javascript" src="js/jquery.js"></script>	
       <script type="text/javascript">
       $(document).ready(function(){//inicio o jQuery
               $("select[name='cidades']").change(function(){
               var idCombo1 = $(this).val();//pegando o value do option selecionado
               //alert(idCombo1);//apenas para debugar a variável

			   if( idCombo1=='0' )
                               return resetaCombo('combo2');

                       $.getJSON(//esse método do jQuery, só envia GET
                               'function.inc.php',//script server-side que deverá retornar um objeto jSON
                               {idCombo1: idCombo1},//enviando a variável

                               function(data){
                               alert(data);//apenas para debugar a variável

                                       var option = new Array();//resetando a variável

                                       resetaCombo('combo2');//resetando o combo
                                       $.each(data, function(i, obj){

                                               option[i] = document.createElement('option');//criando o option
                                               $( option[i] ).attr( {value : obj.id} );//colocando o value no option
                                               $( option[i] ).append( obj.nome );//colocando o 'label'

                                               $("select[name='bairros']").append( option[i] );//jogando um à um os options no próximo combo
                               });
                       });
               });
       });     

       /* função pronta para ser reaproveitada, caso queira adicionar mais combos dependentes */
       function resetaCombo( el )
       {
               $("select[name='"+el+"']").empty();//retira os elementos antigos
               var option = document.createElement('option');                                  
               $( option ).attr( {value : '0'} );
               $( option ).append( 'Escolha' );
               $("select[name='"+el+"']").append( option );
       }
       </script>

 

 

HTML

   Selecione a cidade:<br>
              <select name="cidades" id="cidades"> 
              <option value="">Escolha uma cidade</option>
                                            <? include "classe-cidade.php" ;


	                                           $sql_cidade = mysql_query("SELECT * FROM cidade");
	                                           while ($linha_cidade = mysql_fetch_array($sql_cidade))
	                                          {



	                                                        $cidade = new cidade();

	                                                        $cidade->setid($linha_cidade['id']);
	                                                        $cidade->setnome($linha_cidade['nome']);


?>
                    <option value="<? echo $cidade->getid(); ?>"><? echo $cidade->getnome();?></option> 
<? } ?>

       </select> 



        Selecione o bairro:<br>
	<select name="bairros" id="bairros">
               <option value="0">Escolha</option>
       </select>

 

PHP

<?php
       header("Content-Type: text/html; charset=ISO-8859-1");

       function intGet( $campo ){
               return isset( $_GET[$campo] ) ? (int)$_GET[$campo] : 0;
       }       
       function retorno( $id )
       {

        include "config.php";// aqui seria a conexão com o banco


               $sql = "SELECT `id`, `nome` 
                       FROM `bairro` 
                       WHERE `cidade` = '$id' ORDER BY `nome` ;";







               $q = mysql_query( $sql );


               $json = ' [';

               if( mysql_num_rows( $q ) > 0 )
               {


                       while( $dados = mysql_fetch_assoc( $q ) )
                       {

                                           $json .= '{"nome":"'.$dados['nome'].'","id":"'.$dados['id'].'"}, ';
                       }
               }
               else
                       $json .= '{"nome": "Não Encontrado"}';

               $json .= ']';

               return $json;
       }

       echo retorno( intGet('idCombo1') );
?>

 

 

É isso

 

sera que tem algo pra ativar no servidor, ou algo assim, porque eu tentei fazer o código exatamente igual do seu artigo e não funcionou.

 

Obrigado

[William Bruno 1501]

 <select name="cidades" id="cidades"> 

 

então, deveria ser:

echo retorno( intGet('cidades') );

 

e em todos os lugares onde tiver:

resetaCombo('combo2');

você troca, por:

resetaCombo('bairros');

 

qual versão do jQuery você tá usando?

é provavel que o parser de JSON tenha mudado. Reescreva a parte do each() que lê o retorno, ou então use a mesma versão que usei no link que postei.

[Tuk 0]

uso a mesma versão do Jquery,

 

echo retorno( intGet('idCombo1') ); // Aqui continua sendo idcombo1, imagino eu porque é  a variavel definida lá na frente, foi assim que funcinou, definindo como bairros não funcionou

 

O único erro era trocar o combo2 por bairros.

 

Obrigado pela paciência William, valeu mesmo :clap:

[William Bruno 1501]

bem lembrado, essa variavel, deve ser igual a:

{idCombo1: idCombo1},//enviando a variável

 

é que normalmente, eu costumo 'trocar tudo'.

Mas enfim, que bom que você conseguiu.