Latest web development tutorials

AJAX Database

AJAX można stosować w interaktywnej komunikacji z bazą danych.

AJAX instancji bazy danych

Poniższe przykłady pokażą, jak strona internetowa za pośrednictwem AJAX czytać informacje z bazy danych:

Przykłady


Customer info will be listed here...

Przykłady wyjaśnić - strony HTML

Gdy użytkownik w powyższej listy rozwijanej wybierz klienta, wykonywane pod nazwą "showCustomer ()" funkcja. Funkcja ta przez "onChange" zdarzenie jest wyzwalany:

<!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>

Źródło wyjaśnił:

Jeśli nie wybrać klienta (str.length == 0), to funkcja skasuje txtHint zastępczy, a następnie wyjść z funkcji.

Jeśli wybrałeś klienta, funkcja następnie showCustomer () wykonuje następujące czynności:

  • Tworzenie obiektu XMLHttpRequest
  • Tworzenie funkcji, gdy serwer jest gotowy do przeprowadzenia reakcji
  • Plików na serwerze, aby wysyłać żądania
  • Należy pamiętać, dodany na końcu parametru URL (q) (zawiera zawartość listy rozwijanej)

plik ASP

Powyższe serwery poprzez javascript wywołaniem tej strony jest nazywany "getcustomer.asp" pliki ASP.

"Getcustomer.asp" kod źródłowy działa kwerendy w bazie danych, a następnie zwraca wyniki w postaci tabeli 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>")
%>