0
0
آموزش کامل Ajax در php
آموزش کامل Ajax در php
AJAX (Asynchronous Javascript And Xml) AJAX
درخواست يك صفحه html
درخواست يك صفحه PHP
درخواست يك صفحه با AJAX
XMLHttpRequest
جاوااسکريپت با استفاده از Object خاصي بصورت زير یک درخواست را به سرور ارسال كرده و جوابش را ميگيرد.
اين آبجكت خاص از كلاس XMLHttpRequest ساخته مي شود.
نكته:
جاوااسکريپت براي اجرا به بازخواني صفحه نياز ندارد.
دو نوع كلاس در زبان جاوا اسكريپت براي AJAX وجود دارد
XMLHttpRequest
ActiveXObject
- IE4
- IE5
- IE6
- Firefox
- Opera
- IE7+
- ...
ساختار يك كلاس
متدهاي XMLHttpRequest
متد | توضيح |
---|---|
open(Method,URL,Async,User,Pass) | آغاز عمليات |
send(header) | ارسال اطلاعات بصورت ديتا |
setRequestHeader(header,value) | تعيين header اطلاعات ارسالي |
getResponseHeader(header) | دريافت header جاري بصورت متن |
getAllResponseHeaders() | دريافت تمامي headerها بصورت متن |
Abort() | اتمام فوري عمليات |
متد open
پارامتر | توضيح |
---|---|
نوع ارسال | يکي از عبارات GET ، POST ، HEAD |
URL ارسال | آدرس فايل يا URL براي ارسال و دريافت اطلاعات |
نحوه ارسال | true و false براي تعيين به ترتيب، ارسال غيرهمزمان و همزمان |
نام کاربري | تعيين نام کاربري براي ارسال |
کلمه عبور | تعيين کلمه عبور براي ارسال |
Abort() | اتمام فوري عمليات |
دو مورد اول اجباري هستند
Property هاي XMLHttpRequest
مشخصه | توضيح |
---|---|
onreadystatechange | باعث اجراي تابع متناظر با خودش به ازاي هر بار تغيير وضعيت |
readyState | وضعيت عمليات |
responseText | نتيجه عمليات بصورت Text |
responseXML | نتيجه عمليات بصورت XML |
status | پيغام وضعيت سرور |
statusText | پيغام سرور بصورت متن |
readyState
وضعيت | توضيح |
---|---|
0 | هيچ عملياتي صورت نگرفته |
1 | اطلاعات در حال لود شدن هستند |
2 | عمليات لود به اتمام رسيد |
3 | خاتمه دادن عمليات |
4 | پايان موفقيت آميز عمليات |
status
مقدار | توضيح |
---|---|
220 | براي موفقيت |
404 | Page Not Found |
مثال
مثال: جستجوي يك اسم با استفاده از ajax
صفحات مورد نياز اين كار
Index.html
<form id="form1" name="form1" method="post" action=""> <table width="100%" border="1" cellpadding="0"> <tr> <td> <label > <input type="text" name="textfield" id="textfield" onkeypress="showJavab(this.value)" on/> </label> </td> <td>متن مورد نظر را جهت جستجو وارد كنيد <td> </tr> </table> </form> <div id="javab"></div>
Ajax.js
function showJavab(str) { if (str=="") { document.getElementById("javab").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('javab').innerHTML=xmlhttp.responseText; //document.getElementById(src).innerHTML=req.responseText; } } xmlhttp.open("GET","showjavab.php?q="+str,true); xmlhttp.send(); }
Showjavab.php
<html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> <meta charset="utf-8"> <link href="App_Themes/main/masterpage.css" rel="stylesheet" /> <title>iranganj</title> <script src="ajax.js"></script> </head> <body>
<?php $val=$_GET['q']; $dbhost="localhost"; $dbuser="root"; $dbpass=""; $dbname="data"; echo "$val" $link=mysql_connect($dbhost,$dbuser,$dbpass) or die("Unable to connect to MySQL server"); $q="SELECT * FROM info WHERE name like '%$val%' "; mysql_select_db($dbname); $result=mysql_query($q,$link) or die (mysql_error()); while($row=mysql_fetch_array($result)){ echo "br>. $row['id']. $row['name']. $row[email']; ] ?>
</body> </html>
کته آخر اینه که دیتابیس را هم باید در پوشه مربوطه نیز کپی کنید که مسیر آن به صورت C:\wamp\bin\mysql\mysql5.6.12\data\data می باشد.
نظر / سوال