एज़ैक्स डाटाबेस इस्टैंस

AJAX को डाटाबेस के साथ आपसी संचार के लिए इस्तेमाल किया जा सकता है。

एज़ैक्स डाटाबेस इस्टैंस

नीचे का उदाहरण देखें कि वेब पृष्ठ कैसे AJAX के माध्यम से डाटाबेस से जानकारी पढ़ता है:

ग्राहक जानकारी यहाँ सूचीबद्ध होगी。

स्वयं कोड को प्रयोग कीजिए

उदाहरण व्याख्या - HTML पृष्ठ

जब उपयोगकर्ता ऊपरी ड्रॉप डाउन सूची में किसी ग्राहक को चुनता है, तो "showCustomer()" नामक फ़ंक्शन चलाया जाता है। यह फ़ंक्शन "onchange" इवेंट द्वारा ट्रिगर किया जाता है:

<!DOCTYPE html>
<html>
<head>
<script>
function showCustomer(str)
{
if (str=="")
  {
  document.getElementById("txtHint").innerHTML="";
  return;
  }
if (window.XMLHttpRequest)
  // IE7+, Firefox, Chrome, Opera, Safari के लिए कोड
  xmlhttp=new XMLHttpRequest();
  }
else
  //  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="">एक ग्राहक को चुनें:</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">ग्राहक जानकारी यहाँ सूचीबद्ध होगी...</div>
</body>
</html>

स्रोत कोड व्याख्यान:

यदि कोई ग्राहक चुना नहीं है (str.length बराबर है 0), तो फ़ंक्शन टेक्सटहिंट रिप्लेसर को साफ़ कर फ़ंक्शन से बाहर निकल जाएगा。

यदि कोई ग्राहक चुना हुआ है, तो showCustomer() फ़ंक्शन निम्न पगार की कार्रवाई करेगा:

  • XMLHttpRequest ऑब्जैक्ट बनाएं
  • सर्वर रिस्पोंस तैयार करने पर चलने वाले फ़ंक्शन बनाएं
  • सर्वर पर फ़ाइल के लिए अनुरोध भेजें
  • ध्यान दें कि URL के अंत में जोड़े गए पारामीटर (q) (ड्रॉपडाउन सूची की सामग्री सहित)

एसपी फ़ाइल

इस JavaScript को आमंत्रित करने वाला सर्वर पृष्ठ "गेटकस्टमर.एसपी" नामक एसपी फ़ाइल है。

गेटकस्टमर.एसपी प्रोग्राम में कोड स्रोत एक बार डाटाबेस के लिए की जाएगी, फिर रिजल्ट एचटीएमएल तालिका में बढ़ाया जाएगा:

<%
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>")
  नेक्स्ट
  rs.MoveNext
लूप
response.write("</table>")
%>