|
|
|
| Поискав в сети информацию по запросу «Что такое AJAX», я понял, что это очень полезные, но чрезвычайно сложные методы. Не знаю, часто ли их применяют на практике, но если все же применяют, то наверняка есть типовые решения, позволяющие понять суть дела.
К примеру, как на AJAX будет выглядеть вот такой ввод информации, позволяющий получить ответ без перезагрузки страницы:
<?php
$forma = '<form method="post">
<input type="text" name="im">
<input type="submit" value="Ввести">
</form>';
$im = @$_POST['im'];
if (!$im)
{
echo "<br>$forma";
die(); // Остановка скрипта
}
if ($im == "Вова") echo "Верно!";
else echo "Попробуйте ещё раз.";
|
| |
|
|
|
|
|
|
|
для: Владимир55
(17.06.2009 в 09:28)
| | Не знаю, зачем тут использовать AJAX, все на Javascript легко и хорошо делается... | |
|
|
|
|
|
|
|
для: Zeper
(17.06.2009 в 15:34)
| | А на AJAX сложно и плохо? | |
|
|
|
|
|
|
|
для: Владимир55
(17.06.2009 в 16:05)
| | Насколько я понял, вам нужно что-то вывести на экран, в зависимости от содержимого формы. Так зачем догружать страничку, если можно на стороне клиента все сделать, чем занимается javascript. Доступ к содержимому инпута можно получить так: document.имя формы.имя inputa.value | |
|
|
|
|
|
|
|
для: Zeper
(17.06.2009 в 16:25)
| | Нет, Zeper, мне обязательно нужно взаимодействие с сервером.
Я написал для примера самое простейшее, чтобы высветить алгоритм. А в реале обработка результатов ввода более сложна и требует рнр. Вот по этой причине я хочу освоить такой тип взаимодействия, как AJAX.
Вы сами владеете AJAX? | |
|
|
|
|
|
|
|
для: Владимир55
(17.06.2009 в 17:49)
| | Да, владею. Я не так понял, что вы хотели. Чтобы взаимодействовать с сервером без перезагрузки страницы нужно использрвать объект XMLHTTPRequest. И еще раз сформулируйте, что именно вы хотите услышать в этой теме? Не совсем понятен смысл приведенного вами выше кода. | |
|
|
|
|
|
|
|
для: Zeper
(17.06.2009 в 18:40)
| | Больше всего мне хотелось бы увидеть в стиле AJAX код, который на клиентской машине дал бы форму (или ее AJAX аналог, если в AJAX форма так не задается):
<form method="post">
<input type="text" name="im">
<input type="submit" value="Ввести">
</form>
|
Затем какой-то код, который средствами AJAX передаст на сервер переменную $im = $_POST['im'];
И код, который с сервера передаст браузеру результат обработки этого кода (аналог
if ($im == "Вова") echo "Верно!";
else echo "Неверно.";
|
выведя слова "Верно/Неверно" в небольшом окошке.
Это сложное дело? | |
|
|
|
|
|
|
|
для: Владимир55
(17.06.2009 в 19:28)
| | нет, я бы сейчас Вам написал эти несколько строк, но что значит "который на клиентской машине дал бы форму (или ее AJAX аналог, если в AJAX форма так не задается" ? | |
|
|
|
|
|
|
|
для: ddhvvn
(17.06.2009 в 19:41)
| | Ну, в общем, что бы посетитель увидел форму для ввода. Хотя бы с одним окном. | |
|
|
|
|
|
|
|
для: Владимир55
(17.06.2009 в 19:51)
| | Нужен отдельный php файл, который будет в зависимлсти от пременной $im выдавать верно или не верно, пускай это будет check.php.
if ($_GET["im"] == "Вова") echo "Верно!"; else echo "Неверно.";
|
Файл, в котором находится форма:
<script language="javascript">
function getXmlHttp(){
var xmlhttp;
try {
xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e) {
try {
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
} catch (E) {
xmlhttp = false;
}
}
if (!xmlhttp && typeof XMLHttpRequest!='undefined') {
xmlhttp = new XMLHttpRequest();
}
return xmlhttp;
}
var xmlhttp = getXmlHttp();
function sendData()
{
var im = document.myform.name.value;
xmlhttp.open('POST', 'check.php?im='+im+'', false);
xmlhttp.send(null);
var status = xmlhttp.responseText;
alert (status);
}
</script>
<form name="myform" onsubmit="sendData(); return false;">
<input name="name" type="text"><br>
<input type="submit" value="Проверить">
</form>
|
Сначала создается объект xmlhttprequest фунцией getXmlHttp();, далее в файл check.php посылаются данные, тот в зависимости от переменной im выводит верно или неверно. Это значение попадает в переменную status.
Вам это хотелось увидеть? | |
|
|
|
|
|
|
|
для: Владимир55
(17.06.2009 в 09:28)
| | ajax.htm
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
<title>Демонстрация технологии AJAX</title>
<script type="text/javascript" language="JavaScript">
var req; // Глобальный объект для аяксовских запросов
var ajaxerr; // Переменная для накопления ошибок
//--------------------------------------------------------------------
// Функция создаёт глобальный объект "req" для аяксовских запросов,
// назначает функцию для приема ответа (GetOtvet) и отправляет запрос
// через AJAX на сервер
//--------------------------------------------------------------------
function SendZapros(url) {
req=false;
if(window.XMLHttpRequest) req=new XMLHttpRequest(); // Для всех кроме IE
else if(window.ActiveXObject) req=new ActiveXObject("Microsoft.XMLHTTP"); // Для IE
if(req) req.onreadystatechange=GetOtvet; // GetOtvet - Функция котороя будет принимать ответ
else alert("Объект не создан");
try { req.open("GET",url,true); } catch(e) { ajaxerr++; }
try { req.send(null); }
catch(e) { ajaxerr++; if(ajaxerr<3) SendZapros(url+'&_c_='+Math.random()); else alert(e); }
}
//--------------------------------------------------------------------
// Функция принимающая ответ на запрос
//--------------------------------------------------------------------
function GetOtvet() {
var dt;
if(req.readyState==4){
if(req.status==200){
dt=req.responseXML.getElementsByTagName('otvet')[0].firstChild.data;
Show_Rezultat(dt); // Передаём принятые данные на отображение
}
else {
alert("Проблема с получением XML:\n"+req.statusText);
}
}
}
//--------------------------------------------------------------------
// Функция отображающая результат
//--------------------------------------------------------------------
function Show_Rezultat(data) {
document.getElementById('rez1').innerHTML=data;
}
//--------------------------------------------------------------------
</script>
</head>
<body style="font-size: 16px">
<h1 style="font-size: 22px">Демонстрация технологии AJAX (WIN-1251)</h1>
<form>
<input type="text" id="numa" value="11"> *
<input type="text" id="numb" value="19"> =
<span style="font: normal 18px Arial;" id="rez1">[?]</span>
<br><br>
<input type="button" value=" Ok " onclick="ajaxerr=0;SendZapros('ajax.php?a='+document.getElementById('numa').value+'&b='+document.getElementById('numb').value);">
</form>
</body>
</html>
|
ajax.php
<?
if (!isSet($a)) $a=0;
if (!isSet($b)) $b=0;
$rezultat=HTMLSpecialChars('<span style="font-size:45px;color:blue">Результат='.($a*$b).'</span>');
$rezultat='<?xml version="1.0" encoding="windows-1251" ?>
<telo>
<otvet>'.$rezultat.'</otvet>
</telo>';
header("Content-Type: application/xml");
echo $rezultat;
?>
|
| |
|
|
|
|
|
|
|
для: Владимир55
(17.06.2009 в 09:28)
| | >"Поискав в сети информацию по запросу «Что такое AJAX», я понял, что это очень полезные,
но чрезвычайно сложные методы."
AJAX, по большому счёту, это всего лишь один из способов организации
связи текущей страницы с сервером. Причём это не самый лучший (со всех точек зрения)
способ. Но просто он - самый МОДНЫЙ сегодня.
И он - этот способ - совершенно не сложен.
Возможно вас заинтересует тема по ссылке http://www.softtime.ru/forum/read.php?id_forum=4&id_theme=64682
[поправлено модератором] | |
|
|
|
|
|
|
|
для: Владимир55
(17.06.2009 в 09:28)
| | Возможно вас заинтересует библиотека jQuery. | |
|
|
|