List menu dinamico (categoria e subcategoria)

[Filipe Netto 0]

E ai galera...

 

Trabalho com PHP, estou desenvolvendo um sistema para um site, e apesar de não manjar nada de Java, estou me arriscando a fazer algumas coisas mais dinâmicas.

 

Para o cadastro de um produto neste sistema, existem os campos Categoria e Subcategoria. Através do PHP, o list menu Categoria é montado dinamicamente, a partir dos dados do banco de dados. O problema é o seguinte é no campo subcategoria, pois envolve um refresh na página e tudo mais. Então achei uma função em Java que faz isso que eu preciso.

 

Este é a função da página aonde estão os campos do formulário:

 

function carregar(){ 
Combo1 = document.cadastra.categoria; //ALTERE AQUI PARA SEU FORM E 1º SELECT 
Combo2 = document.cadastra.sub_categoria; //ALTERE AQUI PARA SEU FORM E 2º SELECT 
var url; 
url = 'remote.php?categoria='+Combo1[Combo1.selectedIndex].value; 
Combo2.options.length = 0; 
addItem(Combo2,"Aguarde...carregando","",false,Combo2.length) 
myIframe.location = url; 
Combo2.focus() 
} 

function inicia(){ 
local1 = new Array(); 
var maximo1, i; 
local1 = myIframe.location; 
maximo1 = local1.length; 
Combo2.options.length = 0; 
for (i=0;i<maximo1;i++){ 
addItem(Combo2,local1[i][1],local1[i][0],false,Combo2.length); 
} 
} 

function addItem(obj,strText,strValue,blSel,intPos){  
        var newOpt,i,ArTemp,selIndex;  
        selIndex = (blSel)?intPos:obj.selectedIndex;  
        newOpt = new Option(strText,strValue);  
        Len = obj.options.length+1  
        if (intPos > Len) return  
        obj.options.length = Len  
        if (intPos != Len) {  
                 ArTemp = new Array();  
                 for(i=intPos;i<obj.options.length-1;i++)  
                          ArTemp[i] = Array(obj.options[i].text,obj.options[i].value);  
                 for(i=intPos+1;i<Len;i++)  
                          obj.options[i] = new Option(ArTemp[i-1][0],ArTemp[i-1][1]);  
        }  
        obj.options[intPos] = newOpt;  
        if (selIndex > intPos)  
                 obj.selectedIndex = selIndex+1;  
        else if (selIndex == intPos)   
                 obj.selectedIndex = intPos;  
}  

E este é o conteudo da página remote.php:

 

<?php

include('connect.php');

$categoria = $_GET['categoria']; 

$auxsql = "SELECT categoria, descricao FROM sub_categoria where categoria ='$categoria' "; 
$sql = mysql_query($auxsql); 
if(!$sql){echo mysql_error();exit();} 
?> 

<script> 
  loc = new Array(<?=mysql_num_rows($sql)?>) 
  for (i=0; i < <?=mysql_num_rows($sql)?>; i++) { 
                 loc[i] = new Array(2) 
                                 for (j=0; j < 2; j++) { 
                         loc[i][j] = "0" 
                   } 
   } 

   <? $j = 0; 
         while ($linha = mysql_fetch_array($sql)) {?> 
          loc[<?=$j?>][0] = "<?=$linha[0]?>"; 
          loc[<?=$j?>][1] = "<?=$linha[1]?>"; 
          <? $j++; 
          } 
   ?> 
   parent.inicia();  
</script>

 

Aparentemente, todos os codigos estão corretos, mas por algum motivo não funciona. Quando selecione a categoria, ele aplica o texto "Aguarde... Carregando" na sub-categoria, mas não sai disso.

 

Alguem poderia me ajudar a identificar aonde está o problema?

 

Valeu!

[AlanDariva 2]

Como está seu html? Para funcionar você precisa colocar um iframe no seu html com o nome de myIframe: <iframe name="myIframe"></iframe>. Deixa ele visível por enquanto para testar.

Depois que adicionar o iframe teste de novo.

Se não der certo tenta trocar a função inicia por essa

function inicia(){
	var maximo1, i;  
	maximo1 = loc.length; 
	Combo2.options.length = 0; 
	for (i=0;i<maximo1;i++){ 
		addItem(Combo2,loc[i][1],loc[i][0],false,Combo2.length); 
	} 
} 

[William Bruno 1501]

Fazendo com AJAX fica melhor.

Um combo carregaria o outro.

 

Tem alguns exemplos aqui:

http://forum.imasters.com.br/index.php?/topic/270079-indice-dos-scripts/page__pid__1386245__st__0entry1386245

[Henrique Barcelos 290]

JAVA != JAVASCRIPT

 

Cuidado!!!

 

Siga o tutorial postado pelo William que funciona certinho...

[Filipe Netto 0]

Como está seu html? Para funcionar você precisa colocar um iframe no seu html com o nome de myIframe: <iframe name="myIframe"></iframe>. Deixa ele visível por enquanto para testar.

Depois que adicionar o iframe teste de novo.

Se não der certo tenta trocar a função inicia por essa

 

Alan, eu criei o iframe, e ele "tentou" funcionar, só que não está retornando os valores da sub-categoria. Antes ele ficava "Aguarde... carregando" no segundo combo. Agora, ele muda o valor do combo, mas não traz a lista de sub-categorias.

 

 

Sobre o tutorial que o Willian postou, achei excelente, e entendi como funciona, mas não sei como fazer ele preencher um combo dinâmico com uma lista de valores, ao invés de trazer os dados de um unico registro.

 

O que me sugerem?

 

Valeu pela força...!

[William Bruno 1501]

Filipe acabei desenvolvendo um script de combos dependentes, dá uma olhada.

Tá em jQuery:

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