|
AJAX PHP Пример
AJAX используется для создания более интерактивных приложений.
AJAX PHP Пример
Следующий пример продемонстрирует, как веб страница может взаимодействовать с веб сервером, когда пользователь вводит символы в поле ввода:
Пример
Начните вводить имя в поле ввода ниже (с большой буквы):
Предложения:
|
Попробуйте сами »
|
Объяснения примера - Функция showHint()
Когда пользователь печатает очередной символ в поле ввода выше, выполняется функция "showHint()". Функция вызывается благодаря возникновению события "onkeyup":
function showHint(str)
{
var xmlhttp;
if (str.length==0)
{
document.getElementById("txtHint").innerHTML="";
return;
}
if (window.XMLHttpRequest)
{// код для IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
}
else
{// код для IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
document.getElementById("txtHint").innerHTML=xmlhttp.responseText;
}
}
xmlhttp.open("GET","gethint.php?q="+str,true);
xmlhttp.send();
} |
Пояснение исходного кода:
Если поле ввода является пустым (str.length==0), функция очищает содержимое контейнера txtHint (места вставки предложений) и завершает выполнение.
Если поле ввода не является пустым, функция showHint() осуществляет следующие действия:
- Создает объект XMLHttpRequest
- Создает функцию, которая будет выполнена, когда будет получен ответ с сервера
- Посылает запрос на сервер, в качестве адресата запроса выступает файл с серверным php-скриптом
- Обратите внимание, что параметр (q) добавляется к адресу URL (и содержит текст, введенный в поле ввода)
Серверная страница AJAX - на PHP
Страница на сервере, к которой обращается функция JavaScript выше, является PHP файлом с именем "gethint.php".
Ниже представлено два варианте серверного скрипта - на PHP и на ASP.
Файл PHP
Ниже представлен код на языке PHP.
<?php
// Заполнить массив именами
$a[]="Аня";
$a[]="Алена";
$a[]="Александр";
$a[]="Алексей";
$a[]="Артем";
$a[]="Борис";
$a[]="Василий";
$a[]="Григорий";
$a[]="Геннадий";
$a[]="Дмитрий";
$a[]="Елена";
$a[]="Жанна";
$a[]="Зинаида";
$a[]="Илья";
$a[]="Иннокентий";
$a[]="Кирилл";
$a[]="Константин";
$a[]="Лера";
$a[]="Мария";
$a[]="Николай";
$a[]="Оксана";
$a[]="Петр";
$a[]="Равиль";
$a[]="Радик";
$a[]="Сергей";
$a[]="Савва";
$a[]="Тамара";
$a[]="Тамила";
$a[]="Таисия";
$a[]="Ульяна";
//получить параметр q из адресной строки
$q=$_GET["q"];
//поиск всех подходящих вариантов, если длина q>0
if (strlen($q) > 0)
{
$hint="";
for($i=0; $i<count($a); $i++)
{
if (strtolower($q)==strtolower(substr($a[$i],0,strlen($q))))
{
if ($hint=="")
{
$hint=$a[$i];
}
else
{
$hint=$hint." , ".$a[$i];
}
}
}
}
// Установить ответ в "нет вариантов" если не было найдено ни одного предложения,
// либо вывести подходящие подсказки
if ($hint == "")
{
$response="no suggestion";
}
else
{
$response=$hint;
}
//вывод ответа
echo $response;
?> |
Файл ASP
Исходный код "gethint.asp" проверяет массив имен и возвращает подходящие имена браузеру:
<%
response.expires=-1
dim a(30)
'Заполнение массива именами
a(1)="Аня";
a(2)="Алена";
a(3)="Александр";
a(4)="Алексей";
a(5)="Артем";
a(6)="Борис";
a(7)="Василий";
a(8)="Григорий";
a(9)="Геннадий";
a(10)="Дмитрий";
a(11)="Елена";
a(12)="Жанна";
a(13)="Зинаида";
a(14)="Илья";
a(15)="Иннокентий";
a(16)="Кирилл";
a(17)="Константин";
a(18)="Лера";
a(19)="Мария";
a(20)="Николай";
a(21)="Оксана";
a(22)="Петр";
a(23)="Равиль";
a(24)="Радик";
a(25)="Сергей";
a(26)="Савва";
a(27)="Тамара";
a(28)="Тамила";
a(29)="Таисия";
a(30)="Ульяна";
'получение параметра q из адресной строки URL
q=ucase(request.querystring("q"))
'поиск подсказок из массива, если длина q>0
if len(q)>0 then
hint=""
for i=1 to 30
if q=ucase(mid(a(i),1,len(q))) then
if hint="" then
hint=a(i)
else
hint=hint & " , " & a(i)
end if
end if
next
end if
'Вывод "нет вариантов" если не было найдено подходящего предложения
'или вывод значений-подсказок
if hint="" then
response.write("нет вариантов")
else
response.write(hint)
end if
%> |
|
|