Ajax: Usar Mais De Um Set Na Mesma Página

[heavymetal]

Olá pessoal, estou com um problema com o ajax.

Quero exibir vários sets de informação na página, mas só estou conseguindo um;

Tenho um form com combos dependentes

Escolhe tipo de produto, lista apenas os tipos de produtos

Escolhe marca, mostra as marcas do tipo rscolhido acima

Escolhe modelo, mostra os modelos da marca escolhida acima

O meu códio funciona bem com um set, ou seja, dá pra escolher um tipo, uma marca e um modelo, porém eu preciso usar vários sets na página, se alguém puder ajudar, dando uma dica de onde mudar o código, fico agradecidoo

parte ajax

function novoAjax()
{ 
    /* Cria o objeto AJAX. Esta função é genérica pera qualquer aplicação deste tipo*/
    var xmlhttp=false;
    try
    {
        // Cria o objeto AJAX nos navegadores não Internet Explores (Firefox, Opera)
        xmlhttp=new ActiveXObject("Msxml2.XMLHTTP");
    }
    catch(e)
    {
        try
        {
            // Cria o objeto AJAX nos navegadores Internet Explorer
            xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
        }
        catch(E)
        {
            if (!xmlhttp && typeof XMLHttpRequest!='undefined') xmlhttp=new XMLHttpRequest();
        }
    }
    return xmlhttp; 
}


// Declara os combos que compõem o documento html. Os atributos id devem ser declarados aqui.
var listadeCombos=new Array();
listadeCombos[0]="tipo1";
listadeCombos[1]="marca1";
listadeCombos[2]="modelo1";

function buscaremArray(array, dados)
{
    // Retorna o índice da posição onde se encontra o elemento no array ou deixa nulo se não encontra
    var x=0;
    while(array[x])
    {
        if(array[x]==dados) return x;
        x++;
    }
    return null;
}

function carregaConteudo(idComboOrigem)
{
    // Obtém a posição que ocupa o combo que deve ser carregado no array declarado acima
    var posicaoComboDestino=buscaremArray(listadeCombos, idComboOrigem)+1;
    // Obtém o combo que o usuário modificou
    var comboOrigem=document.getElementById(idComboOrigem);
    // Obtém a opção que o usuário selecionou
    var opcaoSelecionada=comboOrigem.options[comboOrigem.selectedIndex].value;
    // Se o usuário escolheu a opção "-- Selecione -- ", não consulta o servidor e coloca nos combos seguintes a mensagem "-- Selecione --"
    if(opcaoSelecionada==0)
    {
        var x=posicaoComboDestino, comboAtual=null;
        // Busca todos os combos posteriores ao que iniciou o evento onChange e muda o seu estado para disabled
        while(listadeCombos[x])
        {
            comboAtual=document.getElementById(listadeCombos[x]);
            comboAtual.length=0;
            
            var novaOpcao=document.createElement("option"); novaOpcao.value=0; novaOpcao.innerHTML="-- Selecione --";
            comboAtual.appendChild(novaOpcao);    comboAtual.disabled=true;
            x++;
        }
    }
    // Certifica- se de que o combo modificado não é o último da cadeia
    else if(idComboOrigem!=listadeCombos[listadeCombos.length-1])
    {
        // Obtém o elemento do combo que deve ser carregado
        var idSelectDestino=listadeCombos[posicaoComboDestino];
        var selectDestino=document.getElementById(idSelectDestino);
        // Cria o novo objeto AJAX e envia ao servidor o id do combo a ser carregado e a opção selecionada no combo de origem
        var ajax=novoAjax();
        ajax.open("GET", "processo.php?select="+idSelectDestino+"&opcao="+opcaoSelecionada, true);
        ajax.onreadystatechange=function() 
        { 
            if (ajax.readyState==1)
            {
                // Elimina a mensagem "-- Selecione --" e coloca em seu lugar a mensagem "Carregando..."
                selectDestino.length=0;
                var novaOpcao=document.createElement("option"); novaOpcao.value=0; novaOpcao.innerHTML="Carregando...";
                selectDestino.appendChild(novaOpcao); selectDestino.disabled=true;    
            }
            if (ajax.readyState==4)
            {
                selectDestino.parentNode.innerHTML=ajax.responseText;
            } 
        }
        ajax.send(null);
    }
}

parte.php

<?php
// Array que vincula o id dos combos declarados no html com o nome da tabela onde se encontra o seu conteúdo
$listaCombos=array(
"tipo1"=>"tipos",
"marca1"=>"marcas",
"modelo1"=>"modelos",

);

function validaCombo($comboDestino)
{
    // Só valida se o combo enviado via GET existir
    global $listaCombos;
    if(isset($listaCombos[$comboDestino])) return true;
    else return false;
}

function validaOpcao($opcaoSelecionada)
{
    // Só valida se a opção selecionada pelo usuário no combo tiver um valor numérico
    if(is_numeric($opcaoSelecionada)) return true;
    else return false;
}

$comboDestino=$_GET["select"]; $opcaoSelecionada=$_GET["opcao"];

if(validaCombo($comboDestino) && validaOpcao($opcaoSelecionada))
{
    $tabela=$listaCombos[$comboDestino];
    include 'conexion.php';
    conectar();
    $consulta=mysql_query("SELECT id, opcao FROM $tabela WHERE relacao='$opcaoSelecionada'") or die(mysql_error());
    desconectar();
    
    // exibe o combo
    echo "<select name='".$comboDestino."' id='".$comboDestino."' onChange='carregaConteudo(this.id)'>";
    echo "<option value='0'>-- Selecione --</option>";
    while($registro=mysql_fetch_row($consulta))
    {
        // Converte caracteres conflitantes para suas respectivas entidades html para uma visualização correta
        $registro[1]=htmlentities($registro[1]);
        // exibe as opções do combo
        echo "<option value='".$registro[0]."'>".$registro[1]."</option>";
    }            
    echo "</select>";
}
?>

parte php no formulário

<p>
        <label for="tipo1">*Tipo:</label>
        <?php
        function montaCombo1() {
        @include ("config.php");
        $conexao = @mysql_connect($servidor, $usuario_bd, $senha_bd) or die(mysql_error());
        $bd = @mysql_select_db($banco, $conexao);    
        $consulta=mysql_query("SELECT id, tipo FROM tipos");    
        
        echo "<select id='tipo1' name='tipo1' size='1' tabindex='17' onChange='carregaConteudo(this.id)'>";
        echo "<option value='0'>-- Selecione --</option>";
        while($registro=mysql_fetch_row($consulta)) {
            echo "<option value='".$registro[0]."'>".$registro[1]."</option>";
        }
        echo "</select>";
        }
         montaCombo1(); 
         ?>      
        <label for="marca1">*Marca:</label><span>  
        <select id="marca1" name="marca1" size="1" tabindex="18" disabled="disabled">
            <option value="0">-- Selecione --</option>
        </select></span>      
        <label for="modelo1">*Modelo:</label><span>      
        <select id="modelo1" name="modelo1" size="1" tabindex="19" disabled="disabled">
            <option value="0">-- Selecione --</option>
        </select></span>        
        </p>

Desde já agradecido!!!

[.Andreia.]

Eu não entendi a sua aplicação, como que você quer selecionar mais de um se são combos?

[heavymetal]

Obrigado por responder, na verdade eu preciso colocar 30 combos na página, 3 em cada set

O código que postei funciona legal pra 3 combos, se precisar adicionar mais não dá certo, tentei aumentar o número de combos no array vincular mais combos no process.php, mas não dá certo

Eu estou utilizando ele em um form de cadastro, o cliente vai escolher no form o tipo, a marca e o modelo do equipamento, por isso não tem como utilizar apenas três combos, são vários produtos

Desculpe se expliquei mal e mais uma vez agradecido.

Eu não entendi a sua aplicação, como que você quer selecionar mais de um se são combos?