Busca com Select sem Refresh no BD

[kio199]

Tenho a necessidade de criar uma busca com de 1 input tipo texto que ao clicar no 2° input tipo button ele irá buscar no banco de dados os itens da busca e trazer o resultado em um campo de multiple select.

Porem como em minha pagina possui outros 9 campos semelhantes não posso dar refresh na pagina para não perder a busca dos demais campos.

Pensei em usar ajax porem não consegui sucesso.

Abaixo vai meu code:

<code>

<table>

<tr>

<td>

<form>

<input type="text" name="textobuscaveiculos">

<input type="submit" class="Botao" value="Buscar" onclick="ativabuscaveiculos()"/>

</form>

</td>

</tr>

<tr>

<td valign="top">

<label>Veiculos cadastrados</label><br />

<select name="selectveiculos" size="7" id="existenteveiculos" style="width:320px;" >

<?php

$vbuscaveiculo = $_POST['textobuscaveiculos'];

if ($vbuscaveiculo == null){

$queryveiculo = "SELECT * FROM tb_veiculo ORDER BY no_veiculo ASC";

$queryveiculo = mysql_query($queryveiculo, $conexao);

while($dadosveiculo = mysql_fetch_array($queryveiculo)){

echo '<option value='.$dadosveiculo['id_veiculo].'">'.$dadosveiculo['no_veiculo'].'</option>';

}

}

else {

$vbuscaveiculo = $_POST['textobuscaveiculos'];

$queryveiculo = "SELECT * FROM tb_veiculo WHERE no_veiculo LIKE '%".$vbuscaveiculo."%' ORDER BY no_veiculo ASC";

$queryveiculo = mysql_query($queryveiculo, $conexao);

while($dadosveiculo = mysql_fetch_array($queryveiculo)){

echo '<option value='.$dadosveiculo['id_veiculo].'">'.$dadosveiculo['no_veiculo'].'</option>';

}

}

?>

</select>

</td>

</tr>

</table>

</code>

[Rogério Kleinkauf]

Veja este exemplo em ajax.

<select name="cicloano2" id="cicloano2" class="input_busca" disabled="disabled" onchange="pesquisaAlunos2(document.getElementById('instituicao2').value,document.getElementById('curso2').value,this.value);" style="width: 290px;">

                                                         <option value="TODOS">Selecione o ano</option>
                                                                <option value="661">1º ano</option>
                                                                <option value="676">1º ano</option>
                                                                <option value="677">2º ano</option>
                                                                <option value="678">1º ano</option>
                                                                <option value="679">2º ano</option>

                                                                <option value="680">1 ano</option>
                                                                <option value="681">2º e 3º anos</option>
                                                                <option value="682">4º e 5º anos</option>
                                                                <option value="683">6º e 7º anos</option>
                                                                <option value="684">8º e 9º anos</option>
                                                                <option value="685">1º e 2º anos</option>

                                                                <option value="686">3º ano</option>
                                                          </select>


<script>
function pesquisaAlunos2(valor,valor2,valor3)
{
  http.open("GET", "consultaralunos.php?id=" + valor + "&id2=" + valor2 + "&id3=" + valor3, true);
  http.onreadystatechange = handleHttpResponse66;
  http.send(null);
}


function handleHttpResponse66()
{
  src = document.getElementById('alunosa');
  if (http.readyState == 4) {
    results = http.responseText.split(",");
    for( i = 0; i < results.length-1; i++ )
    { 
        string = results[i].split( "|" );
        
        var option = src.options[i];
        var newOption = document.createElement("option");
        newOption.value = string[1];
        newOption.text =  string[0];
        
        try {
             src.add(newOption, null);
         }catch(error) {
             src.add(newOption);
         }
    } 
  }
}

consultaalunos.php

<?php
    include('act/queryrunner.php');

    $id = addslashes($_GET["id"]);
    $id2 = addslashes($_GET["id2"]);
    $id3 = addslashes($_GET["id3"]);

    $objetoConsultaAno = query("SELECT * FROM tb_person WHERE per_instituicao LIKE '$id' AND per_curso LIKE '$id2' AND per_ciclo LIKE '$id3';");
    while($arrayConsultaAno = pg_fetch_array($objetoConsultaAno)){
      echo utf8_encode($arrayConsultaAno["per_nome"]).' - '.utf8_encode($arrayConsultaAno["per_cpf"])."|" . $arrayConsultaAno["per_id"] . ",";
    }
?>

</script>

Qualquer dúvida é só perguntar ; )

[kio199]

encontrei um saida porem quando clico em buscar o campo select fica em branco!!!

possivelmente o erro se encontra na id porem não consigo encontrar a solução, segue o codigo

PAGINA LALA.PHP:

<?php

$conexao=mysql_connect("mysql.gaterlist.com","gaterlist","fGTo05X03ki63");

mysql_select_db('banco', $conexao);

mysql_select_db("gaterlist");

mysql_set_charset('UTF8', $conexao);

?>

<script type="text/javascript" src="http://ajax.googleapis.com/

ajax/libs/jquery/1.4.2/jquery.min.js"></script>

<script type="text/javascript">

$(document).ready(function(){

$(".ativarveiculos").click(function(){

var id=$(this).val();

var dataString = 'id='+ id;

$.ajax({

type: "POST",

url: "lalala.php",

data: dataString,

cache: false,

success: function(html)

{

$(".existenteveiculos").html(html);

} }); }); });

</script>

<input type="text" name="textobuscaveiculos">

<input type="button" class="ativarveiculos" value="Buscar"/>

<select name="selectveiculos" size="7" class="existenteveiculos" id="existenteveiculos" style="width:320px;" >

<?php

$id = $_POST['textobuscaveiculos'];

$queryveiculo = "SELECT * FROM tb_veiculo ORDER BY no_veiculo ASC";

$queryveiculo = mysql_query($queryveiculo, $conexao);

while($dadosveiculo = mysql_fetch_array($queryveiculo)){

$id=$dadosveiculo['id'];

$data=$dadosveiculo['data'];

echo '<option value='.$dadosveiculo['id_veiculo].'">'.$dadosveiculo['no_veiculo'].'</option>';

echo $id;

}

?>

</select>

PAGINA LALALA.PHP

<?php

$conexao=mysql_connect("mysql.gaterlist.com","gaterlist","fGTo05X03ki63");

mysql_select_db('banco', $conexao);

mysql_select_db("gaterlist");

if($_POST['id'])

{

$vbuscaveiculo = $_POST['id'];

echo $vbuscaveiculo;

$queryveiculo = "SELECT * FROM tb_veiculo WHERE no_veiculo LIKE '%".$vbuscaveiculo."%' ORDER BY no_veiculo ASC";

$queryveiculo = mysql_query($queryveiculo, $conexao);

while($dadosveiculo = mysql_fetch_array($queryveiculo)){

echo '<option value='.$dadosveiculo['id_veiculo].'">'.$dadosveiculo['no_veiculo'].'</option>';

}

}

?>

PS: não estou conseguindo usar o campo code do forum! Desculpem o transtorno!

Edited November 10, 2011 by kio199