مثال‌های PHP در AJAX

از موتو کد، دانشنامهٔ برنامه‌نویسی

AJAX برای ساخت نرم‌افزارهایی که نسبت به سایر نرم‌افزارها تعاملی‌تر هستند استفاده می‌شود. [۱]

مثال زیر نشان می‌دهد که چگونه یک صفحه وب می‌تواند در حالی که کاربر کاراکترهایی را در یک فیلد ورودی داده تایپ می‌کند با یک وب سرورارتباط داشته باشد:

مثال

نوشتن یک نام را در فیلد ورودی زیر شروع کنید:

توصیه‌ها:

نام:

Time2wait.svg ساخت نمونه مثال این بخش در دست اقدام است.


توضیح مثال

در مثال بالا، هنگامی که کاربر یک کاراکتر را در فیلد ورودی تایپ می‌کند، تابعی به نام showHint() اجرا می‌شود.

این تابع توسط رویداد onkeyup اجرا می‌شود.

در زیر کد HTML مثال را می‌بینید:

مثال

<html>
<head>
<script>
function showHint(str) {
  if (str.length == 0) {
    document.getElementById("txtHint").innerHTML = "";
    return;
  } else {
    var xmlhttp = new XMLHttpRequest();
    xmlhttp.onreadystatechange = function() {
      if (this.readyState == 4 && this.status == 200) {
        document.getElementById("txtHint").innerHTML = this.responseText;
      }
    };
    xmlhttp.open("GET", "gethint.php?q=" + str, true);
    xmlhttp.send();
  }
}
</script>
</head>
<body>

<p><b>Start typing a name in the input field below:</b></p>
<form>
First name: <input type="text" onkeyup="showHint(this.value)">
</form>
<p>Suggestions: <span id="txtHint"></span></p>
</body>
</html>


مشاهدهٔ نتیجه


توضیح کد:

ابتدا، بررسی می‌شود که فیلد ورودی خالی است یا نه (str.length == 0). در صورتی که فیلد خالی بود، محتوای placeholder ای به نام txtHint پاک می‌شود و از تابع خارج می گرد.

اما، در صورتی که فیلد ورودی خالی نباشد، کارهای زیر را انجام می‌دهد:

  • یک شیء XMLHttpRequest می‌سازد
  • یک تابع برای زمانی که پاسخ سرور آماده است، می‌سازد
  • درخواست را به یک فایل php به نام (gethint.php) روی سرور می‌فرستد
  • توجه داشته باشید که پارامتر q به وسیله دستور gethint.php?q="+str اضافه می‌شود
  • متغیر str محتوای فیلد ورودی را نگه می‌دارد

فایل PHP - "gethint.php"

فایل PHP آرایه‌ای از نام‌ها را بررسی کرده و نام مربوط را به مرورگر بازمی‌گرداند:

<?php
// Array with names
$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";

// get the q parameter from URL
$q = $_REQUEST["q"];

$hint = "";

// lookup all hints from array if $q is different from ""
if ($q !== "") {
  $q = strtolower($q);
  $len=strlen($q);
  foreach($a as $name) {
    if (stristr($q, substr($name, 0, $len))) {
      if ($hint === "") {
        $hint = $name;
      } else {
        $hint .= ", $name";
      }
    }
  }
}

// Output "no suggestion" if no hint was found or output correct values
echo $hint === "" ? "no suggestion" : $hint;
?>

منابع آموزشی