AJAX و PHP (AJAX PHP)
می خواهیم «AJAX و PHP» را وصل کنیم. «AJAX» یعنی درخواستِ پس زمینه بدون رفرش کامل. «PHP» یک زبانِ سمت سرور است. با تایپ کاربر، پیشنهاد نام ها از سرور برمی گردد.
نمونه زنده: پیشنهاد نام با AJAX و PHP
رویداد onkeyup اجرا می شود. سپس تابع showHint() درخواست می فرستد و پاسخ را در صفحه می گذارد.
function showHint(str) {
if (str.length === 0) {
document.getElementById("txtHint").innerHTML = "";
return;
} else {
const xmlhttp = new XMLHttpRequest();
xmlhttp.onload = function() {
document.getElementById("txtHint").innerHTML = this.responseText;
};
xmlhttp.open("GET", "gethint.php?q=" + str);
xmlhttp.send();
}
}
روند کار «AJAX و PHP» به زبان ساده
- کاربر تایپ می کند؛ رویداد onkeyup فعال می شود.
- XMLHttpRequest ساخته و تنظیم می شود.
- درخواست به gethint.php?q=... ارسال می شود.
- PHP در آرایه نام ها جستجو می کند.
- پاسخ رشته ای برمی گردد و نمایش داده می شود.
نکته: اگر ورودی خالی بود، خروجی را پاک کن. سپس، برگشت زودهنگام انجام بده.
فایل PHP چه می کند؟
فایل gethint.php یک آرایه نام دارد. سپس با مقدار q تطبیق می دهد. در پایان، «پیشنهادها» یا «no suggestion» را چاپ می کند.
لینک های داخلی مفید
برای شروع مفاهیم کلی، صفحه AJAX معرفی را ببین. همچنین، جزئیات ارسال درخواست در AJAX درخواست توضیح داده شده است.
جمع بندی سریع
- رویداد صفحه، درخواست AJAX را می فرستد.
- PHP پاسخ متنی تولید می کند.
- DOM با پاسخ به روزرسانی می شود.
- ورودی خالی را سریع مدیریت کن.