Formulário Que Traz Os Dados Dinâmicamente (ajax)

[Mauricio Munhoz 0]

Caros Colegas,Alguém sabe como fazer um formulário simples de pesquisa efetuar a busca dos dados no mysql e exibir os resultados na mesma página sem fazer qualquer chamada ou "reload" da página (dinâmicamente)?Exemplo:- formulário que contém um campo de texto e um combobox com os tipos de pesquisa que podem ser efetuados, envia a pesquisa para o banco de dados- os resultados da pesquisa aparecem logo abaixo do formulário sem chamar alguma outra página e sem recarregar a mesmaAndei lendo alguns sites como www.jquery.com e www.extjs.com para tentar montar um código em javascript e utilizá-lo junto com o php, mas não estou me dando muito bem com essa tecnologia (AJAX), não consegui criar um código que faça a tarefa acima....Agradeço a atenção de todosMauricio

[programador php 0]

JAVASCRIPT

try{

        xmlhttp = new XMLHttpRequest();

}catch(ee){

        try{

                xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");

        }catch(e){

                try{

                        xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");

                }catch(E){

                        xmlhttp = false;                

                }

        }

}

                                                                                                       

fila=[];

ifila=0;

function carrega(url, destino){

        document.getElementById(destino).innerHTML="Carregando Dados";

        fila[fila.length]=[url,destino];

                if((ifila+1)==fila.length)ajaxRun();}function ajaxRun(){

                        url        = fila[ifila][0];

                        destino    = fila[ifila][1];

                        xmlhttp.open("GET", url, true);

                        xmlhttp.setRequestHeader("Content-Type", "application/x-www-form-urlencoded; charset=UTF-8");

                        xmlhttp.setRequestHeader("Cache-Control", "no-store, no-cache, must-revalidate");

                        xmlhttp.setRequestHeader("Cache-Control", "post-check=0, pre-check=0");

                        xmlhttp.setRequestHeader("Pragma", "no-cache");

                        xmlhttp.onreadystatechange=function() {

                                if (xmlhttp.readyState==4){

                                        texto=unescape(xmlhttp.responseText.replace(/+/g," "));        

                                        document.getElementById(destino).innerHTML=texto;

                                        ifila++;

                                        if(ifila<fila.length)setTimeout("ajaxRun()",20);

                                                }

                                }

                                        xmlhttp.send(url);

                        }

                       

                  function enviaForm(frmNome, url, destino){

                        f = document.getElementById(frmNome);

                                var query=url;

                                        for (i=0;i<f.elements.length;i++){              

                                                if(f.elements[i].type == 'radio' && f.elements[i].checked){

                                                        query += i==0 ? '?' : '&';

                                                        query += f.elements[i].name + '=' + f.elements[i].value;

                                                }

                                                                               

                                                if(f.elements[i].type == 'text'){

                                                        query += i==0 ? '?' : '&';

                                                        query += f.elements[i].name + '=' + f.elements[i].value;

                                                }

                                               

                                        }

                                carrega(query, destino);

                        }

                       

function validar() {

        enviaForm('form1', 'calc_festa.php', 'esquerda');

}

 

[url="http-~~-//december.com/html/4/element/input.html"]<input[/url] type="Button" id="calcular" name="calcular" value="Calcular" onClick="validar();">

 

eu criei a funcao validar para ficar mais facil, pois valido todo o form e depois se passou em tudo envio para a DIV dfe baixo

 

qualquer duvida posta ai

 

abraço

[Mauricio Munhoz 0]

Prezado Colega,Vou implementar a sua sugestão para fazer um teste, depois eu posto o result...Obrigado pela ajuda!Mauricio

[Mauricio Munhoz 0]

Estou com algumas dúvidas quanto ao uso... vamos a elas:1 - Criei um arquivo script.js para guardar o código javascript e inseri uma linha no html mencionando o uso do arquivo de script2 - Configurei o form html conforme o código html 3- Não consegui identificar o que está fazendo a query no banco de dados..., ele teria de acessar o mysql, fazer a query e retornar os resultados4- Também não consegui identificar como esses resultados serão publicados na pagina..., é algum método do javascript que será chamado?ObrigadoMauricio