Какво представлява Ajax?
Пълната форма на AJAX е асинхронен JavaScript и XML. Това е технология, която намалява взаимодействията между сървъра и клиента. Това става чрез актуализиране само на част от уеб страница, а не на цялата страница. Асинхронните взаимодействия се инициират от JavaScript. Целта на AJAX е да обменя малки количества данни със сървъра без опресняване на страницата.
JavaScript е скриптов език от страна на клиента. Той се изпълнява от клиентската страна от уеб браузърите, които поддържат JavaScript.JavaScript кодът работи само в браузъри, които имат активиран JavaScript.
XML е съкращението за Extensible Markup Language. Използва се за кодиране на съобщения както в човешки, така и в машинно четими формати. Това е като HTML, но ви позволява да създавате персонализирани маркери. За повече подробности относно XML вижте статията за XML
Защо да използвам AJAX?
- Тя позволява разработването на богати интерактивни уеб приложения, точно като настолни приложения.
- Проверката може да се извърши, когато потребителят попълни формуляр, без да го изпраща. Това може да се постигне с помощта на автоматично завършване. Думите, които потребителят въвежда, се изпращат на сървъра за обработка. Сървърът отговаря с ключови думи, които съответстват на въведеното от потребителя.
- Може да се използва за попълване на падащо поле в зависимост от стойността на друго падащо поле
- Данните могат да бъдат извлечени от сървъра и само определена част от страницата се актуализира, без да се зарежда цялата страница. Това е много полезно за части от уеб страници, които зареждат неща като
- Туитове
- Коменс
- Потребители, посещаващи сайта и т.н.
Как да създадете PHP Ajax приложение
Ще създадем просто приложение, което позволява на потребителите да търсят популярни PHP MVC рамки.
Нашето приложение ще има текстово поле, което потребителите ще въвеждат в имената на рамката.
След това ще използваме mvc AJAX за търсене на съвпадение, след което ще покажем пълното име на рамката точно под формата за търсене.
Стъпка 1) Създаване на индексна страница
Index.php
PHP MVC Frameworks - Search Engine PHP MVC Frameworks - Search Engine
Type the first letter of the PHP MVC Framework
Matches:
ТУК,
-
“Onkeyup =" showName (this.value) "" изпълнява JavaScript функцията showName всеки път, когато се въведе ключ в текстовото поле.
Тази функция се нарича автоматично завършване
Стъпка 2) Създаване на страницата за рамки
frameworks.php
0) {$match = "";for ($i = 0; $i < count($frameworks); $i++) {if (strtolower($name) == strtolower(substr($frameworks[$i], 0, strlen($name)))) {if ($match == "") {$match = $frameworks[$i];} else {$match = $match . " , " . $frameworks[$i];}}}}echo ($match == "") ? 'no match found' : $match;?>
Стъпка 3) Създаване на JS скрипт
auto_complete.js
function showName(str){if (str.length == 0){ //exit function if nothing has been typed in the textboxdocument.getElementById("txtName").innerHTML; //clear previous resultsreturn;}if (window.XMLHttpRequest) {// code for IE7+, Firefox, Chrome, Opera, Safarixmlhttp=new XMLHttpRequest();} else {// code for IE6, IE5xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");}xmlhttp.onreadystatechange=function() {if (xmlhttp.readyState == 4 && xmlhttp.status == 200){document.getElementById("txtName").innerHTML=xmlhttp.responseText;}}xmlhttp.open("GET","frameworks.php?name="+str,true);xmlhttp.send();}
ТУК,
- “If (str.length == 0)” проверете дължината на низа. Ако е 0, тогава останалата част от скрипта не се изпълнява.
- “If (window.XMLHttpRequest) ...” Internet Explorer версии 5 и 6 използват ActiveXObject за внедряване на AJAX. Други версии и браузъри като Chrome, FireFox използват XMLHttpRequest. Този код ще гарантира, че нашето приложение работи както в IE 5 & 6, така и в други високи версии на IE и браузъри.
- “Xmlhttp.onreadystatechange = function ...” проверява дали AJAX взаимодействието е завършено и състоянието е 200, след което актуализира txtName обхвата с върнатите резултати.
Стъпка 4) Тестване на нашето приложение PHP Ajax
Ако приемем, че сте запазили файла index.php В phututs / ajax, намерете URL адреса http: //localhost/phptuts/ajax/index.php
Въведете буквата C в текстовото поле Ще получите следните резултати.
Горният пример демонстрира концепцията за AJAX и как тя може да ни помогне да създадем богати приложения за взаимодействие.
Обобщение
- AJAX е съкращението за асинхронен JavaScript и XML
- AJAX е технология, използвана за създаване на богати приложения за взаимодействие, които намаляват взаимодействията между клиента и сървъра, като актуализират само части от уеб страницата.
- Internet Explorer версия 5 и 6 използват ActiveXObject за изпълнение на AJAX операции.
- Internet Explorer версия 7 и по-нова и браузърите Chrome, Firefox, Opera и Safari използват XMLHttpRequest.