|
|
|
| Здравствуйте! Скажите пожалуйста вики это что такое за чудо(наскоко извесно оно как то связано с ПХП)?? это как язык программирования или что то иное..??...и как добится вики эффектов на странице (чем это достигается), т.е изменение содержимого без перезагрузки страницы.... Кто может дать советы, ссылки объяснения буду очень благодарен)) | |
|
|
|
|
|
|
|
для: Jastin Marty
(04.07.2008 в 09:21)
| | вы путаете wiki (http://ru.wikipedia.org/wiki/Wiki) и ajax (http://ru.wikipedia.org/wiki/Ajax) | |
|
|
|
|
|
|
|
для: mechanic
(04.07.2008 в 09:26)
| | Спасибо, очень полезные ссылки я понял разницу... Тогда мне нужен дЕльный учебник по аяксу...Кто может что посоветовать...И кто знает этот язык скажите насколько он схож с ПХП (те если я середничок в ПХП, то насколько легко я могу освоить АЯКС)...
ПС ... А ВОТ СКАЖИТЕ, ПЛИЗ, ВОЗМОЖНО ЛИ ДИНАМИЧНО ОБРАБОТАТЬ АНАЛОГ ПХП ФУНКЦИИ (т.е выполнить функцию пхп по средствая аякса без перезагрузки страницы?)...буду оч признателен) | |
|
|
|
|
|
|
|
для: Jastin Marty
(04.07.2008 в 09:40)
| | AJAX это яваскрипт+ HTTP запрос с помощью ActiveX компонента броузера. Т.е. нет такого языка - аякс, нужно знать яваскрипт, пхп и хтмл и правильно инициализировать ActiveX (это самое сложное для начинающих, ибо они разные для разных платформ). Но в принципе, это очень просто, достаточно разобрать один готовый пример. | |
|
|
|
|
|
|
|
для: Jastin Marty
(04.07.2008 в 09:40)
| | простейший пример
HTML страница, например index.htm
<html>
<body>
<script>
//платформонезависимая функция получения ajax-объекта
function getXMLHttpObject() {
if (window.ActiveXObject) {
return new ActiveXObject("Microsoft.XMLHTTP");
}
else if (window.XMLHttpRequest) {
return new XMLHttpRequest();
}
else {
alert("Your browser does not support AJAX.");
}
return false;
}
//пример пользовательской функции получения ответа от сервера с помощью ajax
function getName() {
url = 'http://localhost/backend/getName.php'; //это скрипт, который вернет какие то данные
req = getXMLHttpObject();
req.open('GET', url, false);
req.send(null);
return req.responseText(); //весь вывод скрипта getName.php будет возвращен
}
</script>
<a href="#" onclick='alert("Привет " + getName()); return false;'>нажать тут</a>
</body>
</html>
|
скрипт getName.php
надеюсь достаточно доступно, предельно простой пример, даже без использования переменных в ajax-запросе | |
|
|
|
|
|
|
|
для: mechanic
(04.07.2008 в 11:25)
| | Для начала более чем понятно и достаточно. Далее научишься передавать параметры, потом разбирать состояние запроса и.д. по возрастающей. | |
|
|
|
|
|
|
|
для: GeorgeIV
(04.07.2008 в 11:38)
| | Вопрос не в тему:
Как вы выучили ajax? по книге или статьям в инете? | |
|
|
|
|
|
|
|
для: FireTiger
(04.07.2008 в 11:58)
| | я по аналогичному примеру :-)
взял живой пример и экспериментировал с ним, добиваясь в конце концов, того что мне нужно.
А еще до этого разбирал HTTP запросы из PHP (технология в целом одна, AJAX только на яваскрипте основан). | |
|
|
|
|
|
|
|
для: mechanic
(04.07.2008 в 11:25)
| | У меня не работает данный пример, в чем может быть ошибка? | |
|
|
|
|
|
|
|
для: FireTiger
(04.07.2008 в 12:14)
| | например в том, что URL ведет не на тот хост, на котором находится сама html страница | |
|
|
|
|
|
|
|
для: mechanic
(04.07.2008 в 12:21)
| | у меня html страница и getName.php лежат в одном каталоге, я убрал путь и поставил просто
Поскольку с полным путем не работало, да и так тоже не работает... | |
|
|
|
|
|
|
|
для: FireTiger
(04.07.2008 в 12:27)
| | путь должен быть полным путем с хттп, насколько я помню, так что проверь адрес
попробуй еще вместо locallhost написать 127.0.0.1 | |
|
|
|
|
|
|
|
для: GeorgeIV
(04.07.2008 в 12:28)
| | путь 100% правильный, я в браузере запустил с этим путем, мне вывело "Вася".. Значит проблема не в пути? | |
|
|
|
|
|
|
|
для: FireTiger
(04.07.2008 в 12:32)
| | getName.php
<?php
header("Content-type: text/html; charset=windows-1251");
header("Cache-Control: no-store, no-cache, must-revalidate");
header("Cache-Control: post-check=0, pre-check=0", false);
echo 'Вася';
?>
|
HTML
<html>
<head>
</head>
<body>
<script>
var req;
//платформонезависимая функция получения ajax-объекта
//пример пользовательской функции получения ответа от сервера с помощью ajax
function getName()
{
url = 'http://developer/getName.php'; //это скрипт, который вернет какие то данные
if (window.XMLHttpRequest)
{
req = new XMLHttpRequest();
}
else if (window.ActiveXObject)
{
req = new ActiveXObject("Microsoft.XMLHTTP");
}
if (req)
{
req.onreadystatechange = processReqChange;
req.open("GET", url, true);
req.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
req.send();
}
}
function processReqChange()
{
ab = window.setTimeout("req.abort();", 5000);
if (req.readyState == 4)
{
clearTimeout(ab);
// only if "OK"
if (req.status == 200)
{
document.form1.state.value =(req.responseText); //весь вывод скрипта getName.php будет возвращен
}
else
{
alert("Не удалось получить данные:\n" + req.statusText);
}
}
}
</script>
<form name="form1" >
<input type="text" name="state" disabled value="Поехали"><br>
<input type="button" onclick='getName()' value="нажать тут">
</form>
</body>
</html>
|
только вместо developer поставь имя своей машины, у меня срабатывает и при localhost и при 127.0.0.1
этот код я проверил | |
|
|
|
|
|
|
|
для: GeorgeIV
(04.07.2008 в 13:38)
| | Спасибо, все отлично работает! А можете объяснить, в чем была проблема? | |
|
|
|
|
|
|
|
для: FireTiger
(04.07.2008 в 13:53)
| | файл пхп без дополнительных заголовков. по крайней мере у меня из за этого | |
|
|
|
|
|
|
|
для: GeorgeIV
(04.07.2008 в 13:38)
| | А вот еще такой вопрос:
когда я делаю POST запрос так:
req.open("POST", url, true);
req.send('name1=value1&name2=value2');
|
То данные из поста не приходят... В чем тут проблема? | |
|
|
|
|
|
|
|
для: FireTiger
(04.07.2008 в 15:47)
| | а как определяешь и как реализован возврат в пхп коде?
value1 - это такое значение параметра или это имя переменной? | |
|
|
|
|
|
|
|
для: GeorgeIV
(04.07.2008 в 16:20)
| | банально пишу
<?php
echo '<pre>'; print_r($_POST); echo '</pre>';
?>
|
| |
|
|
|
|
|
|
|
для: FireTiger
(04.07.2008 в 16:22)
| |
<?php
header("Content-type: text/html; charset=windows-1251");
header("Cache-Control: no-store, no-cache, must-revalidate");
header("Cache-Control: post-check=0, pre-check=0", false);
echo $_POST['name1'];
?>
|
а так? должен отобразиться value1
насколько я понимаю, должно быть только одно echo, так как потом поток закрывается и следующий код уходит в никуда.
|
PS это дествительно не так | |
|
|
|
|
|
|
|
для: GeorgeIV
(04.07.2008 в 16:28)
| | >насколько я понимаю, должно быть только одно echo, так как потом поток закрывается и следующий код уходит в никуда.
нет, весь вывод от скрипта будет доступен в req.responseText();
хоть 100 echo | |
|
|
|
|
|
|
|
для: mechanic
(04.07.2008 в 16:36)
| | да, при проверке ошибся с параметрами. действительно весь вывод уходит в поток | |
|
|
|
|
|
|
|
для: GeorgeIV
(04.07.2008 в 16:28)
| | Оо, все я понял, когда экспериментировал, пропустил строчку
req.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
| . Вот ее поставил, и все заработало! Спасибо огромное! | |
|
|
|
|
|
|
|
для: GeorgeIV
(04.07.2008 в 16:28)
| | вот возник еще один вопрос:
Если я пишу теги HTML в выходной поток данных от php скрипта, то этот текст не отображается... Как быть?
Добавлено позже:
Извиняюсь, проблема решена, да и не было проблемы, ошибка синтаксиса. | |
|
|
|
|
|
|
|
для: Jastin Marty
(04.07.2008 в 09:21)
| | Можно написать, например, Гостевую книгу, которая будет работать без перезагрузки остального контента страницы. При этом не будет использовано AJAX вообще, а из JS всего три события. | |
|
|
|
|
|
|
|
для: sim5
(04.07.2008 в 13:19)
| | Как это можно сделать? | |
|
|
|
|
|
|
|
для: Rustamich
(07.07.2008 в 00:14)
| | Используя плавающий фрейм (IFRAME) в качестве контейнера-приемника. В общем все до безобразия просто - все содержимое Гостевой книги будет отдаваться сервером в контейнер, от куда его содержимое будет записываться в элемент DIV, что обеспечит работу Гостевой во всех браузерах. Кодировка, стили, скрипты - все это будет использоваться то, что прописано в заголовке страницы.
Реализовать можно двояко, напишу только суть одного способа - отправляем форму, которая будет определять навигацию по страницам Гостевой. В дальнейшем (если будете делать такую гостевую), поняв суть, можно удалить форму, присваивая параметры вызова непосредственно атрибуту src IFRAME. Чтобы не запутаться в объяснении, будем полагать, что все вызовы происходят через индексный файл. Хотя, конечно же, все может обрабатывать отдельный скрипт обработчик.
По переходу на Гостевую книгу, помещаем в область основного контента страницы следующий код:
<form action="index.php" method="post" name="navi" id="navi"
onsubmit="this.setAttribute('target','buff');">
<input type="hidden" name="offset" id="offset" value="0">
</form>
<iframe src="index.php?guest" onload="window.document.getElementById('guest').innerHTML= buff.document.body.innerHTML;"
frameborder='0' width='0' height='0' name=buff id=buff></iframe>
<div id="guest"></div>
|
При загрузке этого кода на страницу, на сервер будет послан запрос, по которому отдаем в контейнер содержимое гостевой по умолчанию. В данном способе, это первоначальная загрузка гостевой, которую будет определять IFRAME (его запрос), в дальнейшем навигацию по гостевой будет определять элемент "offset" формы "navi". Делать это будем посредством простой JS функции:
function sendEntry(offs) {
document.getElementById("offset").value = offs;
document.getElementById("navi").setAttribute('target','buff');
document.navi.submit();
}
|
Аргументом для этой функции будем передавать смещение страниц, а вызов ее будет происходить из навигатора гостевой. То есть, формируя постраничную навигацию, указываем, например:
[<a class="calssName" href="javascript:sendEntry(0)">1-10</a>]
[<a class="calssName" href="javascript:sendEntry(10)">11-20</a>]
и т.д.
|
Форма для добавления сообщений в гостевую, страницы гостевой и ее навигатор, все это будет отдаваться сервером в контнейнер (IFRAME) с именем (ID) "buff", и перезаписываться в элемент DIV - "guest". Это весь механизм работы, ну а далее уже работа сервера - формирование ответа. Код гостевой я писать конечно не буду, а остановлюсь лишь на двух моментах. Первое, это форма добавления сообщений. Событие onsubmit этой формы, будет вызывать механизм получения/записи содержимого от сервера, тот же, который используется и в форме "navi". Ее код (без учета полей имени, мыла, сообщения и прочего) будет следующим:
<form action="index.php" method="post" name="postGuest" id="postGuest"
onsubmit="this.setAttribute('target','buff'); this.send.disabled=true;">
<!-- поля формы -->
<input type="submit" name="send" value="Отправить">
<input type="hidden" value="post" name="userpost">
</form>
|
В событие onsubmit этой формы добавлена блокировка кнопки SUBMIT от повторной отправки. В остальном она работает также как и первая, за исключением того, что отправка ее происходит "естественным" путем - кнопкой SUBMIT.
Если серер получает get-запрос $_GET["guest"], значит это первичная загрузка гостевой. Проверяем, было ли установлено смещение пост-запросом, было ли уже отправлено сообщение, если нет, то формируем форму сообщений с пустыми полями, получаем сообщения гостевой из базы, строим навигатор и отдаем в браузер весь этот контент, завершая это функцией exit(). На нее надо обратить особое внимание (второй момент) - все операции по выдачи в контейнер, в нашем случае, обязаны заканчиваться этой функцией, если предполагается, что это не единственный участок кода. Все это тоже самое, как остановить выполнение скрипта, выдав что-то пользователю, только в этом случае, если это забыть сделать, ничего страшного не произойдет - вместо ожидаемого нами, пользователь увидит результат дальнейшей работы скрипта. В нашем же случае, это может обернуться катастрофой для браузера пользователя. Может случиться ситуация, когда дальнейшая работа скрипта, вызовет создание новой страницы, и содержимое отправленное сервером для нашего контейнера, вызовет исключительную ситуацию в браузере, так как контейнер (IFRAME) на этот момент существовать не будет - память под него еще не будет распределена.
В случае когда сервер получает запрос от формы добавления сообщений (в примере проверяем это по скрытому полю "userpost"), проверяем на допустимость ввода, заполнение полей и прочее. В случае ошибок возвращаем пользователю форму с уже заполненным содержимым и с указанием ошибок. Если все оформлено верно, записываем сообщение в базу и... Здесь вольны поступать так, как желательно вам. Либо блокируете дальнейший вывод формы (выше упоминалась проверка этого), выводя только сообщения гостевой, если сообщения модерируются. Либо можно установить счетчик на время, после которого можно добавить новое сообщение (антифлуд), устанавливая, например, в сессии переменную. Это уже зависит от характера работы гостевой.
Обилие слов может и страшит, но если взять сам код, просто попробовать на примере не большом, уяснить принцип работы, то не так все страшно. Достоинство - простота, отсутствие проблем с кодировкой, а содержимое передаваемое в IFRAME может быть любым. Пробуйте. | |
|
|
|