Relacionamento entre combobox por php e jquery

cmdmss · 18 de fevereiro de 2010

Pessoal, peguei um tutorial para fazer um relacionamento entre combobox por jquery, mas nofinal de tudo nao funcionou, to quebrando minha cabeça aqui pra achar o erro mas nada! Sera que vocês podem me ajudar?

Este é o arquivo index.php

<HTML>
<HEAD>
 <TITLE>Combobox mesmo</TITLE>
 <script type="text/javascript" src="jquery-1.4.1.mim.js"></script>
 <script type="text/javascript">
   $(document).ready(function(){
      $("select[name=Empresas]").change(function(){
       $("select[name=Unidades]").html('<option value="0">Carregando...</option>');

         $.post("unidades.php",
         {Empresas:$(this).val()},
         function(valor){
            $("select[name=Unidades]").html(valor);
         }
         )
      })
   })
 </script>
</HEAD>
<BODY>
  <form action="" method="post">
        <select name="Empresas">
                <option value="0"> Escolha a Empresa</option>
        <?
        require_once("conecta.php");
        $sql="SELECT * from empresas ORDER BY Empresas ASC";
        $qr=mysql_query($sql) or die (mysql_error());

        while($ln=mysql_fetch_assoc($qr)){
          echo '<option value="'.$ln['id'].'">'.$ln['Empresas'].'</option>';
        }
        ?>
        </select>
        <select name="Unidades">
                <option value="0" disable="disable"> Escoha a unidade</option>
        </select>
  </form>
</BODY>
</HTML>

Unidades.php

<HTML>
<HEAD>
 <TITLE>New Document</TITLE>
</HEAD>
<BODY>
<?
  require_once("conecta.php");
  $empresas=$_POST['Empresas'];
  $sql="SELECT * FROM unidades WHERE Empresas_ID = '$empresas' ORDER BY Unidades ASC";
  $qr=mysql_query($sql) or die (mysql_error());

  if (mysql_num_rows($qr) == 0){
   echo '<option value="0">Empresa não possui unidade</option>';
  }else{
        while($ln = mysql_fetch_assoc($qr)){
         echo '<option value="'.$ln['id'].'">'.$ln['Unidades'].'</option>';
        }
   }
?>
</BODY>
</HTML>

E é claro que o conecta.php está funcionando normalmente e o arquivo jquery-1.4.1.mim.js também está na mesma pasta.

O resultado disto tudo é quando eu seleciono a empresa, o combobox das unidades chega aparecer "carregando..." muito rapidamente mas depois fica em branco...

No meu banco de dados, tenho a tabela empresas devidamente preenchida com as colunas id e Empresas e outra tabela com o nome unidades com as colunas id, Empresas_ID(que está relacionada com o id da tabela empresas) e Unidades.

Alguem pode me dar a luz no fim do tunel?

rafaelf.luiz · 19 de fevereiro de 2010

Amigo, eu faço assim:

===================================

<select name="SIGLA_BOX" id="SIGLA_BOX" class="inputbox" onchange="ajaxComboBox('xml/xml_departamento.php','SIGLA_BOX', 'DEPARTAMENTO_SELECT');">
    <option value=""><?php // Aqui você abre para imprimir a lista desejada ?></option>
</select>

==================================


<select name="DEPARTAMENTO_SELECT" id="DEPARTAMENTO_SELECT" class="inputbox">
    // Este é o segundo select, aqui que irá ser impresso o resultado referente ao primeiro.
</select>

==================================


<script type="text/javascript" src="/library/js/ajaxComboBox.js"></script>
//Link de onde se encontra o arquivo ajaxComboBox.js

==================================

ajaxComboBox.js

var HttpReq = null;
var dest_combo = null;

function ajaxComboBox(url, comboBox, comboBox_Dest){
       dest_combo = comboBox_Dest;
     var indice = document.getElementById(comboBox).selectedIndex;
     var sigla = document.getElementById(comboBox).options[indice].getAttribute('value');
     url = url + '?id=' + sigla;
     if (document.getElementById) { //Verifica se o Browser suporta DHTML.
            if (window.XMLHttpRequest) {
               HttpReq = new XMLHttpRequest();
               HttpReq.onreadystatechange = XMLHttpRequestChange;
               HttpReq.open("GET", url, true);
               HttpReq.send(null);
           } else if (window.ActiveXObject) {
               HttpReq = new ActiveXObject("Microsoft.XMLHTTP");
               if (HttpReq) {
                      HttpReq.onreadystatechange = XMLHttpRequestChange;
                      HttpReq.open("GET", url, true);
                      HttpReq.send();
               }
           }
      }
}
function XMLHttpRequestChange() {
    if (HttpReq.readyState == 4 && HttpReq.status == 200){
        var result = HttpReq.responseXML;
        var nome_func = result.getElementsByTagName("nome");
        document.getElementById(dest_combo).innerHTML = "";
        for (var i = 0; i < nome_func.length; i++) {
            new_opcao = create_opcao(nome_func[i]);
            document.getElementById(dest_combo).appendChild(new_opcao);
        }
    }
}
function create_opcao(cidade) { 
    var new_opcao = document.createElement("option");
    var texto = document.createTextNode(cidade.childNodes[0].data);
    new_opcao.setAttribute("value",cidade.getAttribute("id"));
    new_opcao.appendChild(texto); //Adiciona o texto a OPTION.
    return new_opcao; // Retorna a nova OPTION.
}

=========================================================================

xml_departamento.php

<?php
include_once $_SERVER['DOCUMENT_ROOT']."/library/libraries/oracle_db.php"; // local da conexão com DB
$ORA = new IX_ORACLE_DB("six", "six", "servidor_teste"); // abre o DB
$CODIGO = $_GET['id']; // pega o ID passado pelo SIGLA_BOX que vem através do xml_departamento.php

$LISTA = $ORA->IXORA_SELECT("V_COLABORADORES i, USUARIO j","j.CODUSUARIO, i.SIGLA, i.SIGLA_DEPARTAMENTO","j.USERNAME = i.SIGLA AND i.SIGLA = '$CODIGO'","i.SIGLA"); // SQL que irá retornar o valor do segundo select, no meu caso o DEPARTAMENTO_SELECT

header("Content-type: text/xml; charset=ISO-8859-1");
print '<?xml version="1.0" encoding="ISO-8859-1"?>';

?>
<departamento>
<?php 
for ($i=1;$i<=count($LISTA);$i++) {
    print("<nome id=\"".$LISTA[$i][2]."\">".str_replace("&", " - ", $LISTA[$i][3])."</nome>");
}

?>
</departamento>

=========================================

Espero que tenha dado alguma ajuda...

Abraço

cmdmss · 19 de fevereiro de 2010

Amigo, obrigado pela ajuda mas de acordo com o seu codigo, eu teria de mudar toda a estrutura do que eu fiz. Procuro uma solução para o meu problema pois eu estou quase lá. Quem puder ajudar, ficarei agradecido!