Aqui não explicarei como é feita a parte do Ajax pois no fórum já tem bastante exemplos. Estou partindo do ponto em que vocês recebem os dados do Ajax.
Observações:
1) o retorno do ajax tem que vir em uma estrutura similar a um array. Como fazer isso? Lá na página onde voces fazem a busca no banco de dados tem o resultado da pesquisa certo? É só imprimir o resultado com as separações para a função javascript saber dividí-las.
2) Como é um exemplo, coloquei fixo a variavel Retorno, mas ela deve vir do Ajax. Exemplo:
CODE
SetaCampos(xmlHttp.responseText);
3) Os campos que devem receber valores precisam conter um ID igual, como no exemplo "grupo".
4) O array de retorno deve estar na ordem de exibição dos campos, exemplo: "primeiro_valor|segundo_valor|terceiro_valor". Ou seja, a ordem em que os campos do grupo estao sendo exibidos.
Sugestão:
O exemplo usa o ID para apontar quais campos receberão valores. Isso quando a aplicação recebe campos no meio que não receberam - como no exemplo o campo 3. Uma sugestao para quando voces não tiverem esta situação, é envolver todos os campos dentro de uma DIV.
Exemplo de aplicação:
Para voces terem ideia aonde isso pode ser aplicado, imaginem aquelas buscas de endereço onde digita-se o CEP e retornam os dados (Endereço, número, cidade, estado) e cada campo receba seu valor.
Navegadores:
Testado e funcionando no IE 7 e Firefox 2.0.0.14
Código:
CODE
<script language="JavaScript">
function SetaCampos(Retorno) {
var frm = document.frm.grupo;
var TotalElementos = frm.length;
var ArrayRetorno = Retorno.split("|");
for (var i=0; i < TotalElementos; i++)
{
frm[i].value = ArrayRetorno[i];
}
}
</script>
<form name="frm">
Campo1:<input type="text" name="campo1" id="grupo">
Campo2:<input type="text" name="campo2" id="grupo">
Campo3:<input type="text" name="campo3">
Campo4:<input type="text" name="campo4" id="grupo">
Campo5:<input type="text" name="campo5" id="grupo">
<input type="button" value="Buscar" onclick="SetaCampos('valor1|valor2|valor3|valor4')">
</form>
function SetaCampos(Retorno) {
var frm = document.frm.grupo;
var TotalElementos = frm.length;
var ArrayRetorno = Retorno.split("|");
for (var i=0; i < TotalElementos; i++)
{
frm[i].value = ArrayRetorno[i];
}
}
</script>
<form name="frm">
Campo1:<input type="text" name="campo1" id="grupo">
Campo2:<input type="text" name="campo2" id="grupo">
Campo3:<input type="text" name="campo3">
Campo4:<input type="text" name="campo4" id="grupo">
Campo5:<input type="text" name="campo5" id="grupo">
<input type="button" value="Buscar" onclick="SetaCampos('valor1|valor2|valor3|valor4')">
</form>
Qualquer dúvida, crítica, elogio ou sugestão.... só postar
