Быстрый способ начать использовать AJAX-эффекты

Комплекс скриптов, позволяющий заполнять формы и изменять содержимое страниц, не обновляя их, стал символом концепции Web 2.0. Кто-то даже назвал AJAX “наконец заработавшим JavaScript”. Для тех, кто хочет начать использовать его на своих сайтах, я сейчас объясню как это сделать на простейшем примере. Это, конечно, не руководство, но направление и дальнейшие источники информации я покажу.
Итак, первое, что нужно сделать, это скачать script.aculo.us (146 Кб), и распаковать его. В дистрибутиве есть каталог с примерами — он потом может пригодиться. А js-файлы из каталогов lib и src можно положить в какой-нибудь отдельный каталог на вашем сайте для более удобного использования.
Попробуем использовать эти скрипты на простом примере — редактирование текста пользователем без перезагрузки страницы. Создадим пустую html-странцу. Пропишем в ней подключение необходимых скриптов из скачанного дистрибутива:

<script src=»/prototype.js» type=»text/javascript»></script>
<script src=»/scriptaculous.js» type=»text/javascript»></script>

Проверить работу AJAX уже можно, например, вставьте следующий код в страницу, откройте её и кликните мышкой по тектсту:

<div onclick=»new Effect.SwitchOff(this)»>
Исчезающий текст.
</div>

Если не работает — проверьте пути скриптов. Если работает, то продолжим — создадим сам изменяемый текстовый элемент:

<p id=»editme»>Этот будет изменяться</p>
<script type=»text/javascript»>
new Ajax.InPlaceEditor ( ‘editme’, ‘/return.php’, { callback: function (form, value) { return ‘myparam=’ + escape(value) }})
</script>

В этом коде мы сначала добавляем изменяемый текст с ID, по которому его определит скрипт, а потом вызываем метод Ajax.InPlaceEditor, передавая ему ID редактируемого текста (editme), адрес программы-обработчика, которая примет и сохранит изменения и определяем способ передачи этой программе данных (в данном случае — через POST-переменную myparam).
В качестве скрипта для сохранения информации можно использовать программу на любом доступном языке программирования — от ASP до PHP или Ruby. Её задача — получить параметры, сохранить, и обязательно вернуть, что бы изменённый текст сохранился на странице. Как сохранить данные можно узнать в руководстве по соответствующему языку программирования. В качестве примера я просто получу данные и верну их с помощью PHP.

<?php
Echo $_POST[‘myparam’];
?>

Скрипт готов, ему уже можно найти применение.
Ответы на частозадаваемые вопросы по script.aculo.us можно найте в его официальном FAQ.

Полное описание работы и использования всех методов можно найти в Scriptaculous wiki.