Latest web development tutorials

AJAX Database

AJAX può essere utilizzato per la comunicazione interattiva con il database.


istanza di database AJAX

Gli esempi che seguono dimostreranno come una pagina web tramite la tecnologia AJAX leggere le informazioni dal database:

Esempi


Customer info will be listed here...


pagina HTML - Esempi spiegano

Quando un utente nell'elenco a discesa sopra, selezionare un cliente, eseguito dal nome ") showCustomer (" la funzione. Questa funzione dall'evento "onchange" viene attivato:

<!DOCTYPE html>
<html>
<head>
<script>
function showCustomer(str)
{
if (str=="")
{
document.getElementById("txtHint").innerHTML="";
return;
}
if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
}
else
{// code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
document.getElementById("txtHint").innerHTML=xmlhttp.responseText;
}
}
xmlhttp.open("GET","getcustomer.asp?q="+str,true);
xmlhttp.send();
}
</script>
</head
<body>

<form>
<select name="customers" onchange="showCustomer(this.value)">
<option value="">Select a customer:</option>
<option value="ALFKI">Alfreds Futterkiste</option>
<option value="NORTS ">North/South</option>
<option value="WOLZA">Wolski Zajazd</option>
</select>
</form>
<br>
<div id="txtHint">Customer info will be listed here...</div>

</body>
</html>

Fonte ha spiegato:

Se non si seleziona un cliente (str.length == 0), la funzione sarà chiaro txtHint segnaposto, e quindi uscire dalla funzione.

Se è stato selezionato un cliente, la funzione quindi showCustomer () esegue le seguenti operazioni:

  • Creare l'oggetto XMLHttpRequest
  • Creare funzione quando il server è pronto per eseguire la risposta
  • File sul server per inviare le richieste
  • Si prega di notare aggiunto alla fine del parametro URL (q) (contiene il contenuto della lista a discesa)

file ASP

I suddetti server tramite JavaScript chiamando questa pagina è chiamato file ASP "getcustomer.asp".

"Getcustomer.asp" codice sorgente esegue una query sul database, e quindi restituisce i risultati in una tabella 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("/db/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>")
%>