पीएचपी और एज़ीएक्सआई माइक्रोसॉफ्ट सक्रिय डाटाबेस इंस्टैंस

AJAX 可用来与数据库进行交互式通信。

AJAX 数据库实例

在下面的 AJAX 实例中，我们将演示网页如何使用 AJAX 技术从 MySQL 数据库中读取信息。

在下拉列表中选择一个客户


此处将列出客户信息。

这个应用程序由四个元素组成：

  • MySQL 数据库
  • 一张简单的 HTML 表单
  • JavaScript
  • PHP 页面

数据库

将在本例中使用的数据库看起来类似这样：

id CustomerID CompanyName ContactName Address City PostalCode Country
1 Alibaba Alibaba Group Ma Yun ...... Hangzhou 310002 China
2 APPLE Apple Inc. Tim Cook ...... Cupertino 95014 USA
3 BAIDU BAIDU Inc. Li YanHong ...... Beijing 100080 China
4 Canon Canon USA Inc. Tsuneji Uchida ...... New York 11042 USA

उदाहरण व्याख्या

उपरोक्त उदाहरण में, जब उपयोगकर्ता उपरोक्त ड्रॉपडाउन सूची में ग्राहक को चुनता है तो 'showUser()' नामक फ़ंक्शन चलता है。

यह फ़ंक्शन onchange इवेंट द्वारा ट्रिगर किया जाता है。

यह HTML कोड है:

उदाहरण

<!doctype html>
<html>
<head>
<script>
function showUser(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 (this.readyState==4 && this.status==200) {
      document.getElementById("txtHint").innerHTML=this.responseText;
    }
  }
  xmlhttp.open("GET","/demo/getcustomer.php?q="+str,true);
  xmlhttp.send();
}
</script>
</head>
<body>
<form>
<select name="users" onchange="showUser(this.value)">
<option value="">कृपया एक ग्राहक चुनें：</option>
<option value="1">Alibaba</option>
<option value="2">APPLE</option>
<option value="3">BAIDU</option>
<option value="4">Canon</option>
<option value="5">Google</option>
<option value="6">HUAWEI</option>
<option value="7">Microsoft</option>
<option value="8">Nokia</option>
<option value="9">SONY</option>
<option value="10">Tencent</option>
</select>
</form>
<br>
<div id="txtHint"><b>ग्राहक जानकारी यहाँ सूचीबद्ध की जाएगी。</b></div>
</body>
</html>

चलाने वाला स्थान

कोड व्याख्या:

पहले, यह जाँच कीजिए कि क्या किसी ग्राहक को चुना गया है। अगर कोई ग्राहक नहीं चुना गया है (str == "") तो txtHint की सामग्री को मिटाएं और फ़ंक्शन से बाहर निकलें। अगर किसी ग्राहक को चुना गया है, तो नीचे दिए गए काम करें:

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

PHP फ़ाइल

ऊपरी JavaScript कॉल करने वाला सर्वर पर का पेज 'getuser.php' नाम का PHP फ़ाइल है。

“getuser.php” में कोड से MySQL डाटाबेस पर क्वेरी चलाई जाती है और HTML तालिका में परिणाम वापस किया जाता है:

<?php
$q = intval($_GET['q']);
$con = mysqli_connect('MyServer','MyUser','MyPassword','Customers');
if (!$con) {
    die('Could not connect: ' . mysqli_error($con));
}
$sql="SELECT * FROM customerslist WHERE id = '".$q."'";
$result = mysqli_query($con,$sql);
echo "<table>";
while($row = mysqli_fetch_array($result)) {
    echo "<tr><th>CustomerID</th><td>" . $row['CustomerID'] . "</td></tr>";
    echo "<tr><th>CompanyName</th><td>" . $row['CompanyName'] . "</td></tr>";
    echo "<tr><th>ContactName</th><td>" . $row['ContactName'] . "</td></tr>";
    echo "<tr><th>Address</th><td>" . $row['Address'] . "</td></tr>";
    echo "<tr><th>City</th><td>" . $row['City'] . "</td></tr>";
    echo "<tr><th>PostalCode</th><td>" . $row['PostalCode'] . "</td></tr>";
    echo "<tr><th>Country</th><td>" . $row['Country'] . "</td></tr>";
}
echo "</table>";
mysqli_close($con);
?>

व्याख्या: जब JavaScript से PHP फ़ाइल को प्रश्न किया जाता है तो निम्नलिखित कार्य होता है:

  • PHP द्वारा MySQL सर्वर से कनेक्शन खोला
  • सही ग्राहक पाया गया
  • एक HTML तालिका बनाएं, डाटा भरें और 'txtHint' प्लेसहोलर को वापस भेजें