Buscar registros do banco de dados sem recarregar a página e sem usar AJAX

Você precisa estar logado para dar um feedback. Clique aqui para efetuar o login
Para efetuar o download você precisa estar logado. Clique aqui para efetuar o login
Confirmar voto
0
 (0)  (0)

Veja neste artigo: Como buscar registros do banco de dados sem recarregar a página e sem usar AJAX.

Autor: Rafael Martin - rafa_40005@hotmail.com

 

Neste artigo vou apresentar como trazer dados do banco sem recarregar a página e sem usar AJAX, após selecionar um registro na combobox. É um recurso que, particulamente, uso bastante, mas é pouco utilizado na área e no mercado.

Chega de papo e vamos ao que interessa. Crie um arquivo chamado default.asp.

Abaixo comento toda a programação, para que você entenda todas as etapas do código. O artigo será a partir do código.

<%
'----------------------------------------------------------------------
'Aqui vamos estabelecer conexão com o banco de dados
Dim oConn, oRS, sql
Set oConn = Server.CreateObject("ADODB.Connection")
oConn.Open "Provider=Microsoft.Jet.OLEDB.4.0; Data Source=" & Server.MapPath("banco.mdb")
'----------------------------------------------------------------------
%>

<form name="frmMain" id="frmMain" method="post">
            <table border="0" cellpadding="2" cellspacing="0" align="center">
                        <tr>
                                   <td>
                                               Nome:
                                   </td>
                                   <td>
<!-- A função sel_nome() que chamamos no onchange é onde está o grande segredo -->
<select name="cmbNome" id="cmbNome" width:350px;height:20;background-color:#f2f2f2; color:#333333;" onChange="sel_nome();">
                                                           <option value="0">- -</option>
<%
'----------------------------------------------------------------------                                                            'Aqui vamos trazer os dados do banco
                                                           sql = "SELECT id, nome, telefone, email FROM tb_dados order by nome"
                                                           set oRS = oConn.execute(sql)
'----------------------------------------------------------------------
                                                          
'Agora nós vamos ler todas as linhas (registros) que temos no banco
                                                           while not oRS.EOF
                                              
%>
<!-- --------------------------------------------------------------------------------------------------- -->
<!-- Atenção! Reparem que no valeu da combo existe 0, 1, 2 e 3. Eles representam a coluna do banco de cada campo no banco. Sempre devemos começar contando do zero, já que estamos trabalhando com vetor. -->

                                                             <option value="<%Response.Write(oRS(0) & "|" & oRS(1) & "|" & oRS(2) & "|" & oRS(3))%>">
<!-- Aqui é exibido o conteúdo da coluna 1, que é o campo nome. -->
                                                                       <%=oRS(1)%>
                                                             </option>
<%     
                                                                       oRS.MoveNext
                                                           wend
                                              
                                                           oRS.close
                                                           set oRS = nothing                           
%>
                                   </select>
                                   </td>
                        </tr>
                        <tr>
                                   <td>
                                               Telefone:
                                   </td>
                                   <td>
                                               <input type="text" name="telefone" value="" width:100px;height:20;background-color:#f2f2f2; color:#333333;">
                                   </td>
                        </tr>
                        <tr>
                                   <td>
                                               Email:
                                   </td>
                                   <td>
                                               <input type="text" name="email" value="" width:250px;height:20;background-color:#f2f2f2; color:#333333;">
                                   </td>
                        </tr>
            </table>
</form>

<script>
/* Aqui é que está o grande segredo */
            function sel_nome()
            {
// Primeira coisa: Se vocês repararem no código fonte da página, vão reparar que o valeu da combo está desta forma:
//<option value="1|rafael|93442001|rafa_40005@hotmail.com">
//<option value="2|testeRafael|55555555|testerafael@ig.com.br">
// Com os valores do banco de dados.
// E se vocês perceberem, vão ver também que aparecem 2 combos. Isso porque existem duas linhas no banco, ou seja, se tivesse 100 linhas no banco, teria 100 combos no código fonte da página.

                        var arr = new String(frmMain.cmbNome.value);
// Vamos dar um split para pegarmos os valores que estão no valeu da combo
// Como vocês podem ver na linha abaixo

                        arr = arr.split('|');

// Nós pegamos os registros, pertencente àquele nome que você selecionou na combo.
// Prestem atenção que estamos chamando ARR de 2 e ARR de 3.
// Como trabalhamos com vetor, começamos do 0. Se vocês contarem os valores que estão dentro do valeu da combo, vejam que o campo telefone está na posição 2 e o campo email está na posição 3.

                        frmMain.telefone.value = arr[2];
                        frmMain.email.value = arr[3];
                       
// Lembrem-se: o nome do campo (input) e o nome do form na página devem estar iguais ao campo que você chama na função GavaScript.
// Como aqui

frmMain.telefone.value = arr[2];
            }
</script>

Bom, é isso, espero que tenha sido útil!

Abraços!

 

 
Você precisa estar logado para dar um feedback. Clique aqui para efetuar o login
Receba nossas novidades
Ficou com alguma dúvida?