پی ایچ پی اور ایجیکس ریاستی درخواست

درخواست AJAX

در این مثال AJAX، ما نشان می‌دهیم که چگونه صفحه وب با سرور آنلاین ارتباط برقرار می‌کند، وقتی کاربر داده‌ها را در فرم وب وارد می‌کند.

نام را در حیطه زیر وارد کنید:

پیشنهادات:

این مثال شامل سه صفحه است:

  • فرم ساده HTML
  • بخشی از JavaScript
  • صفحه PHP

فرم HTML

این یک فرم HTML است. این شامل یک فرم ساده HTML و لینک به JavaScript است:

<html>
<head>
<script src="clienthint.js"></script> 
</head>
<body>
<form> 
نام اول:
<input type="text" id="txt1"
onkeyup="showHint(this.value)">
</form>
<p>پیشنهادات: <span id="txtHint"></span></p>
</body>
</html>

مثال توضیحی - فرم HTML

همانطور که می‌بینید، صفحه HTML بالا یک فرم ساده HTML دارد که یک حیطه ورودی به نام "txt1" دارد.

این فرم به این شکل کار می‌کند:

  1. وقتی کاربر کلید را در حیطه ورودی فشار می‌دهد و رها می‌کند، یک رویداد فعال می‌شود
  2. وقتی این رویداد فعال می‌شود، فنکشن showHint() اجرا می‌شود
  3. در زیر فرم یک <span> به نام "txtHint" وجود دارد. این به عنوان جایگزین داده‌های return شده توسط فنکشن showHint() استفاده می‌شود.

JavaScript

کد JavaScript در فایل "clienthint.js" ذخیره می‌شود، که به مستند HTML متصل شده است:

ورقي xmlHttp
فنکشن showHint(str)
{
اگر (str.length==0)
  { 
  document.getElementById("txtHint").innerHTML=""
  return
  }
xmlHttp=GetXmlHttpObject()
if (xmlHttp==null)
  {
  alert ("بورسر ایندریٹ سرور پر سوال پر مدد نہیں دیتا");
  return
  } 
var url="gethint.php"
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 || xmlHttp.readyState=="complete")
 { 
 document.getElementById("txtHint").innerHTML=xmlHttp.responseText 
 } 
}
function GetXmlHttpObject()
{
var xmlHttp=null;
try
 {
 // فائرفاکس، اوپرا 8.0+، سافری
 xmlHttp=new XMLHttpRequest();
 }
catch (e)
 {
 // انٹرنیٹ ایکسپلورر
 try
  {
  xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");
  }
 catch (e)
  {
  xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
 }
return xmlHttp;
}

مثال توضیح:

showHint() فنکشن

جب کوئی حرف آپر بولی میں لکھا جائے تو اس فنکشن کو ایک بار کا کارروائی کی جائے گا

اگر ٹیکسٹ بکس میں کوئی مواد موجود ہو (str.length > 0)، تو اس فنکشن کی طرح اپنا کام کریگا:

  1. سرور پر بھیجنا ہوئی URL (فائل کا نام) کا تعریف کریں
  2. پریز کی جانے والی شامل جلد کا پارامتر (q) اس URL میں شامل کریں
  3. ایک رینڈم سانبر اضافے کریں تاکہ سرور کا استعمال کی جانے والا کینچ فائل نہیں کیا جائے
  4. XMLHTTP آئی او کا قیام کرنے کے لئے GetXmlHttpObject فنکشن کو بلاگ کریں، جب کسی واقع میں مشغولیت آئی تو اس آئی او کو بتائیں کہ فنکشن کا نام stateChanged ہے
  5. معلوم کی URL کا استعمال سے اس XMLHTTP آئی او کو کھولیں
  6. کوئی سرور پر سوال ارسال کریں

如果输入域为空，则函数简单地清空 txtHint 占位符的内容。

stateChanged() 函数

每当 XMLHTTP 对象的状态发生改变，则执行该函数。

在状态变成 4 （或 "complete"）时，用响应文本填充 txtHint 占位符 txtHint 的内容。

GetXmlHttpObject() 函数

AJAX 应用程序只能运行在完整支持 XML 的 web 浏览器中。

علیکداری کا کد GetXmlHttpObject() کی فونکشن سے کیا گیا ہے۔

یہ فونکشن مختلف براؤزرز کے لئے مختلف XMLHTTP اوبجیکٹ بنانے کے مسئلے کو حل کرتی ہے۔

یہ چیز پچھلے سیکشن میں توضیح دی گئی ہے۔

PHP پیج

جس کا نام "gethint.php" رکھا گیا، وہ ایک سادے سرور پیج ہے جو جاوا اسکریپت کے ذریعے بلاک کیا جاتا ہے。

"gethint.php" میں کی گئی کد ناموں کا آرائی کا چیک کرے گا اور اس کے بعد کلائنٹ کو ناموں کی پاسنگ کرے گا:

<?php
//ناموں کے آرائی کا پورا کریں
$a[]="Anna";
$a[]="Brittany";
$a[]="Cinderella";
$a[]="Diana";
$a[]="Eva";
$a[]="Fiona";
$a[]="Gunda";
$a[]="Hege";
$a[]="Inga";
$a[]="Johanna";
$a[]="Kitty";
$a[]="Linda";
$a[]="Nina";
$a[]="Ophelia";
$a[]="Petunia";
$a[]="Amanda";
$a[]="Raquel";
$a[]="Cindy";
$a[]="Doris";
$a[]="Eve";
$a[]="Evita";
$a[]="Sunniva";
$a[]="Tove";
$a[]="Unni";
$a[]="Violet";
$a[]="Liza";
$a[]="Elizabeth";
$a[]="Ellen";
$a[]="Wenche";
$a[]="Vicky";
//ق پارامتر کو یو آر ایل سے حاصل کریں
$q=$_GET["q"];
//لیک اپ شائیپس سے اگر ق کی لمبائی 0 سے زیادہ ہو
اگر (strlen($q) > 0)
{
$�نٹ="";
برای($i=0; $i<count($a); $i++)
  {
  اگر (tolower($q)==tolower(substr($a[$i],0,strlen($q))))
    {
    اگر $�نٹ==""
      {
      $�نٹ=$a[$i];
      }
    درآمد
      {
      $�نٹ=$�نٹ." , ".$a[$i];
      }
    }
  }
}
// اگر کوئی مظہر نہ پائا، نتیجہ کو "no suggestion" رکھئے
//یا صحیح کی گئی اقدار کو ست
اگر $�نٹ == ""
{
$ریسپانس="no suggestion";
}
درآمد
{
$ریسپانس=$�نٹ;
}
//ریسپانس کو نمائش کریئے
ایچیو $ریسپانس;
؟>

اگر جاوا اسکریپٹ سے مطلب پیش کیا گیا (strlen($q) > 0)، تو:

  1. اگر جس نام کو جاوا اسکریپٹ سے بھیجایا، اس کا مطابقت پائی جائے
  2. اگر متعدد نام پائے، ریسپانس میں تمام نام شامل کریئے
  3. اگر کوئی نام نہ پائا، ریسپانس کو "no suggestion" رکھئے
  4. اگر ایک یا زیادہ نام پائے، ریسپانس کو ان ناموں میں سے ایک رکھئے
  5. ریسپانس کو "txtHint" مخاطب کو بھیجئے