PHP and AJAX MySQL Database Example
- ບ່ອນໜ້າຫນ້າກ່ອນ AJAX XML
- ບ່ອນໜ້າຫນ້າທ້າຍ AJAX responseXML
AJAX ສາມາດນຳໃຊ້ເພື່ອການສື່ສານກັບຖານຂໍ້ມູນຢ່າງສຳຄັນ.
ການຄົ້ນຄວ້າ AJAX ຖານຂໍ້ມູນ
ໃນການຄົ້ນຄວ້າ AJAX ລະຫວ່າງການໃຊ້ AJAX ທີ່ອາດບັນທຶກຂໍ້ມູນຈາກຖານຂໍ້ມູນ MySQL:
ເລືອກລູກຄ້າໃນວາງລົງ:
ການປະກອບຕັ້ງຂອງຄອມພິວເຕີ້ນີ້ຈະປະກອບດ້ວຍຫນື່ງສິບສີ່ປະກອບ:
- ຖານຂໍ້ມູນ MySQL
- ຟັບ HTML ຮູບຮູບບາງຢ່າງສະເພາະ
- JavaScript
- PHP ເວັບໄຊ
ຖານຂໍ້ມູນ
ບັນຊີຂອງຖານຂໍ້ມູນທີ່ຈະນຳໃຊ້ໃນກໍລະນີນີ້ຄືກັນນັ້ນ:
id | ລະຫັດລູກຄ້າ | ຊື່ບໍລິສັດ | ຊື່ຜູ້ຕິດຕໍ່ | ທີ່ຢູ່ | ຕົວເມືອງ | ລະຫັດໂທລະຄົມ | ປະເທດ |
---|---|---|---|---|---|---|---|
1 | Alibaba | Alibaba Group | ມາ ຢູນ | ...... | ຮັງຊາວ | 310002 | China |
2 | APPLE | Apple Inc. | ທິມ ຄູບ | ...... | ຄູບຕັນໂບ | 95014 | USA |
3 | BAIDU | BAIDU Inc. | ລີ ຢາຮົງ | ...... | ບາງຈົງກິນບົງ | 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 ຟາຍ
ຂໍ້ຄວາມຂອງ
<?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 File, ຈະເກີດການດັ່ງຕໍ່ມາ:
- PHP ສາຍຕໍ່ກັບ MySQL Server
- ພົບລູກຄ້າທີ່ຖືກຕ້ອງ
- ສ້າງການແຕ້ມ HTML, ບັນທຶກຂໍ້ມູນ, ແລະສົ່ງຄືນ "txtHint" ຄຳປະກອບ
- ບ່ອນໜ້າຫນ້າກ່ອນ AJAX XML
- ບ່ອນໜ້າຫນ້າທ້າຍ AJAX responseXML