Los últimos tutoriales de desarrollo web
 

AJAX Ejemplo de base de datos


AJAX se puede utilizar para la comunicación interactiva con una base de datos.


AJAX bases de datos ejemplo

El siguiente ejemplo demostrará cómo una página web puede capturar información desde una base de datos con AJAX:

Ejemplo


Customer info will be listed here...

Inténtalo tú mismo "


Ejemplo Explicación - El showCustomer() Función

Cuando un usuario selecciona un cliente en la lista desplegable de arriba, una función llamada "showCustomer()" se ejecuta. La función se activa por el "onchange" evento:

showCustomer

function showCustomer(str) {
  var xhttp;
  if (str == "") {
    document.getElementById("txtHint").innerHTML = "";
    return;
  }
  xhttp = new XMLHttpRequest();
  xhttp.onreadystatechange = function() {
    if (xhttp.readyState == 4 && xhttp.status == 200) {
    document.getElementById("txtHint").innerHTML = xhttp.responseText;
    }
  };
  xhttp.open("GET", "getcustomer.asp?q="+str, true);
  xhttp.send();
}

El showCustomer() la función hace lo siguiente:

  • Compruebe si se ha seleccionado un cliente
  • Crear un XMLHttpRequest objeto
  • Cree la función a ejecutar cuando la respuesta del servidor está listo
  • Enviar la solicitud fuera a un archivo en el servidor
  • Nótese que un parámetro (q) se añade a la URL (con el contenido de la lista desplegable)

El AJAX página de servidor

La página en el servidor llamado por el código JavaScript de arriba es un archivo ASP llamada "getcustomer.asp" .

El archivo de servidor podría ser fácilmente reescrito en PHP, o algunos otros lenguajes de servidor.

Mira un ejemplo correspondiente en PHP .

El código fuente en "getcustomer.asp" ejecuta una consulta a una base de datos, y devuelve el resultado en una tabla HTML:

<%
response.expires=-1
sql="SELECT * FROM CUSTOMERS WHERE CUSTOMERID="
sql=sql & "'" & request.querystring("q") & "'"

set conn=Server.CreateObject("ADODB.Connection")
conn.Provider="Microsoft.Jet.OLEDB.4.0"
conn.Open(Server.Mappath("/ datafolder /northwind.mdb"))
set rs=Server.CreateObject("ADODB.recordset")
rs.Open sql,conn

response.write("<table>")
do until rs.EOF
  for each x in rs.Fields
    response.write("<tr><td><b>" & x.name & "</b></td>")
    response.write("<td>" & x.value & "</td></tr>")
  next
  rs.MoveNext
loop
response.write("</table>")
%>