Ajax/Ajax მონაცემთა ბაზა
მაგალითი:
ეს არის HTML გვერდი. ის შეიცავს უბრალო HTML ფორმას და ბმულს JavaScript-ზე.
<html> <head> <script src="selectcustomer.js"></script> </head> <body> <form> Select a Customer: <select name="customers" onchange="showCustomer(this.value)"> <option value="ALFKI">Alfreds Futterkiste <option value="NORTS ">North/South <option value="WOLZA">Wolski Zajazd </select> </form> <p> <div id="txtHint"><b>Customer info will be listed here.</b></div> </p> </body> </html>
როგორც ხედავთ, ეს არის უბრალო HTML ჩამოსაშლელი მენიუ, სახელად "customers"
ზემოთ მოყვანილ მაგალითში პარაგრაფი შეიცავს განყოფილებას "txtHint". ეს განყოფილება გვერდზე ინახავს სივრცეს, ვებ სერვერიდან გამოგზავნილი მონაცემების გამოსასახავად.
როდესაც მომხმარებელი მონისნავს მონაცემს, ფუნქცია სახელად "showCustomer()", გაეშვება. ამ ფუნქციის გაშვებას იწვევს "onchange" მოვლენა. სხვა სიტყვებით: ყოველთვის, როდესაც მომხმარებელი შეცვლის მნიშვნელობას ჩამოსაშლელ მენიუში, გამოძახებულ იქნება ფუნქცია showCustomer.
Ajax JavaScript
[რედაქტირება]ეს არის ფაილში "selectcustomer.js" მოთავსებული JavaScript.
var xmlHttp function showCustomer(str) { xmlHttp=GetXmlHttpObject(); if (xmlHttp==null) { alert ("Your browser does not support AJAX!"); return; } var url="getcustomer.asp"; url=url+"?q="+str; url=url+"&sid="+Math.random(); xmlHttp.onreadystatechange=stateChanged; xmlHttp.open("GET",url,true); xmlHttp.send(null); } function stateChanged() { if (xmlHttp.readyState==4) { document.getElementById("txtHint").innerHTML=xmlHttp.responseText; } } function GetXmlHttpObject() { var xmlHttp=null; try { // Firefox, Opera 8.0+, Safari xmlHttp=new XMLHttpRequest(); } catch (e) { // Internet Explorer try { xmlHttp=new ActiveXObject("Msxml2.XMLHTTP"); } catch (e) { xmlHttp=new ActiveXObject("Microsoft.XMLHTTP"); } } return xmlHttp; }
Ajax სერვერული გვერდი
[რედაქტირება]სერვერული გვერდი, რომელსაც იძახებს JavaScript, არის უბრალო ASP გვერდი, სახელად "getcustomer.asp".
კოდი უშვებს SQL მონაცემთა ბაზებს და შედეგებს აბრუნებს 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>") %> `