دليل أساسي AJAX

إجابة AJAX

مثال AJAX PHP

في هذا الفصل، سنعرض كيفية إرسال طلب AJAX إلى ملف PHP وكيفية استرداد محتوى ملف PHP.

مثال AJAX PHP 1

يعرض المثال التالي كيفية التواصل بين صفحة الويب وشبكة الخادم واسترداد محتوى ملف PHP:

تشغيل الكود

شرح المثال:

في المثال السابق، تنفذ وظيفة fetchDoc() وظيفة onclick.

هذا كود HTML:

　　<button type="button" onclick="fetchDoc()">Fetch Content</button>
　　<div id="output"></div>
　　
　　<script>
　　دالة fetchDoc() {
　　var httpRequest = new XMLHttpRequest();
　　httpRequest.onreadystatechange = function() {
　　　if (this.readyState === 4 && this.status === 200) {
　　　　document.getElementById("output").innerHTML = this.responseText;
　　　}
　　};
　　httpRequest.open("GET", "ajax_time.php", true);
　　httpRequest.send();
　　}
　　</script>

هذا كود PHP (ajax_time.php):

　　<?php
　　إرسال تاريخ("d/m/Y, h:i:s A");
　　?>

مثال AJAX PHP 2

يعرض المثال التالي كيفية التواصل بين صفحة الويب وشبكة الخادم عند كتابة المستخدم في حقل الإدخال:

ابدأ الكتابة في الحقل التالي لتسمية الدولة/المساحة:

الدولة:

ملاحظات:

تشغيل الكود

شرح المثال:

في المثال السابق، عند كتابة المستخدم في حقل الإدخال، تنفذ وظيفة showHint().

هذا كود HTML:

　　<!DOCTYPE html>
　　<html>
　　
　　<div>
　　<p>ابدأ الكتابة في الحقل التالي لتسمية الدولة/المساحة:</p>
　　<p>الدولة: <input type="text" onkeyup="showHint(this.value)"></p>
　　<p>إرشادات: <span id="result"></span></p>
　　</div>
　　
　　<script>
　　م変ية elem = document.getElementById("result");
　　دالة عرض التلميح (اسم) {
　　إذا (طول الاسم === 0) {
　　　elem.innerHTML = "";
　　　return;
　　} else {
　　　var httpRequest = new XMLHttpRequest();
　　　httpRequest.onreadystatechange = function() {
　　　　　if (this.readyState === 4 && this.status === 200) {
　　　　　　elem.innerHTML = this.responseText;
　　　　　}
　　　};
　　　httpRequest.open("GET", "ajax_hint.php?q=" + name, true);
　　　httpRequest.send();
　　}
　　}
　　</script>
　　
　　
　　</html>

هذا هو رمز PHP (ajax_hint.php):

　　<?php
　　
　　// مصفوفة أسماء البلدان
　　$countries = array("Afghanistan", "Albania", "Algeria", "American Samoa", "Andorra",...);
　　// يتم الحصول على معامل q من URL
　　$q = $_REQUEST["q"];
　　
　　$hint = "";
　　
　　// إذا كان $q مختلفًا عن التلميحات في اللوحة، يتم مرور جميع التلميحات في اللوحة
　　if ($q !== "") {
　　　　$q = strtolower($q);
　　　　$len = strlen($q);
　　　　foreach($countries as $name) {
　　　　if (stristr($q, substr($name, 0, $len))) {
　　　　　　if ($hint === "") {
　　　　　　　　$hint = $name;
　　　　　　} else {
　　　　　　　　$hint .= ", $name";
　　　　　　}
　　　　}
　　　　}
　　}
　　
　　// إذا لم يتم العثور على التلميحات أو إرجاع القيمة الصحيحة، يتم إرجاع "no suggestion"
　　echo $hint === "" ? "no suggestion" : $hint;
　　
　　?>

للحصول على قائمة كاملة بأسماء البلدان، يرجى الرجوع إلىhttps://gist.github.com/DHS/1340150

إجابة AJAX