Легкий AJAX в массы
Сейчас много различных библиотек и фреймворков доступно для разработчиков. Честно говоря я думаю, что их слишком много. Я изучил прекрасную библиотеку на javascript - Prototype.js и удивительную библиотеку script.aculo.us для создания визуальных эффектов.
Однако эти решения полностью написаны на javascript и исполняются на машине клиента. Цитируя некоторых именитых PHP разработчиков имеющих посредственные знания в javascript, что делает очень затруднительным использование этих библиотек в PHP приложениях. К счастью я натолкнулся на библиотеку xAJAX, которая полностью написана на PHP, который включает Ajax функции.
При использовании библиотеки xAJAX требуется ОЧЕНЬ мало знаний по javascript, однако при использовании других библиотек я бы сказал что требуются солидные знания javascript. Я полагаю что интеграция Prototype.js в библиотеку xAJAX сделала бы его еще лучше, и разработчикам пришлось бы сталкиваться с javascript еще меньше. Хорошо что все это планируется в новых версиях xajax. Учитывая все это, я полагаю xAJAX это наиболее подходящий выбор для PHP разработчиков, которые будут интегрировать в свои вебприложения Ajax.
Основные принципы xAJAX При начале работы с xAJAX вы должны привыкнуть к некоторым вещам. Мы должны увидеть в PHP коде xAJAX, некоторый вид циклического процесса, который содержит в себе события на стороне клиент и события на стороне сервера.
Мощь xAJAX заключается в том, что мы можем вызвать PHP функцию напрямую из клиентского окружения. Функции, описанные в бекенде (PHP функции на сервере) доступны во фронтенде (dhtml/javascript на стороне клиента). Очень мощный встроенный механизм. Хорошие новости для разработчиков – фактически 99% javascript генерируются автоматически посредством xajax. Давайте ознакомимся с начальными сведениями – из чего состоит xAJAX .
Я создал четыре различных примера, которые помогут понять различные способы применения xAJAX. Однако есть некоторые принципы относящиеся ко всем примерам. Давайте посмотрим что это за принципы:
Шаг 1: подключение класса – библиотеки xAJAX require_once("xajax.inc.php"); Мы всегда подключаем библиотеку xajax.
Шаг 2: Функция xajax на стороне сервера function makeBold($p_sArg) { $sOut = ''.$p_sArg.''; $objResponse is new xajaxResponse(); $objResponse->addAssign('my_element', 'innerHTML', $sOut); return $objResponse->getXML(); } Функция получает строковый параметр $p_sArg в качестве аргумента и возвращает его в тегах .
Первым делом мы инициализируем объект xajaxResponse который будет обрабатывать ответ на клиентской стороне. Вторым мы назначаем элемент HTML, который будет обновлятся посредством объекта xajaxResponse.
Метод xajaxResponse->addAssign() имеет 3 аргумента:
Значение id тега элемента HTML на нашей странице Свойство, которое мы хостим изменить на стороне клиента Данные, которые мы хотим передать на сторону клиента В заключении, мы возвращаем ответ используя метод xajaxResponse->getXML().
Эти действия ВСЕГДА совершаются на стороне сервера посредством функций Ajax functions. Но здесь я хочу рассказать немного больше о классе xajaxResponse. Кроме того о методе я хочу рассказать поподробней xajaxResponse->addAssign().
Я взял список ниже с домашней страницы xajax и добавил несколько пояснений.
addAssign($sTargetId,$sAttribute,$sData)
Назначает свойству ($sAttribute) элемента, с id равным $sTargetId новые данные ($sData).
В связи с этим мы можем заменять данные определенного элемента новыми, сгенерированными на сервере.
$objResponse->addAssign("contentDiv","innerHTML", "Some Text");
$objResponse->addAssign("checkBox1","checked","true");
addAppend($sTargetId,$sAttribute,$sData)
Добавляет после, данные ($sData) к свойству элемента ($sAttribute), с id равным $sTargetId. Это значит, что в содержание свойства элемента будет находится старое значение, после которого добавлен результат выполнения функции на стороне сервера.
$objResponse->addAppend("contentDiv","innerHTML", "Some Text");
addPrepend($sTargetId,$sAttribute,$sData)
Добавляет перед, данные ($sData) к свойству элемента ($sAttribute), с id равным $sTargetId.
Это значит, что в содержание свойства элемента будет находится старое значение, перед которым добавлен результат выполнения функции на стороне сервера.
$objResponse->addPrepend("contentDiv","innerHTML", "Some Text");
addReplace($sTargetId,$sAttribute,$sSearch,$sData) заменяет все вхождения поиска ($sSearch) данными ($sData) в свойстве ($sAttribute) элемента HTML с id = $sTargetId
$objResponse->addReplace("contentDiv","innerHTML", "text","text");
addClear($sTargetId,$sAttribute) Удаляет значение свойства($sAttribute) элемента HTML с id=$sTargetId
$objResponse->addClear("Input1","value");
addCreate($sParentId, $sTagname, $sId, $sType)
Добавляет элемент-потомок ($sTagName) существующего элемента с id= $sParentId, и назначает id элемента-потомка ($sId), также можно задать тип элемента потомка $sType.
$objResponse->addCreate("form1","input", "pass", "password");
addRemove($sElementId)
Удаляет элемент с id=$sElementId из вашего приложения
$objResponse->addRemove("div1");
addAlert($sMsg) Показывает предупреждение javascript c текстом = $sMsg $objResponse->addAlert("The server said: Hi!");
addScript($sJS) Выполняет код JavaScript, содержащийся в $sJS.
Этим мощным методом мы можем отсылать на сторону клиента для немедленного исполнения.
$objResponse->addAlert("var txt = prompt('get some text');");
Шаг 3: Для всего этого создаем оболочку. После установки одной или нескольких функций конечно же ничего не случается.
Мы должны сделать некоторые обязательные вещи:
$objAjax = new xajax(); $objAjax->registerFunction('makeBold');
$objAjax->processRequests();
Первым делом мы создаем экземпляр класса xajax. Этот обект будет обрабатывать все события. Вторым мы регистрируем функцию для объекта xAJAX, которую ранее создали.
Делаем это посредством метода xajax->registerFunction().
В заключении мы можем обработать запросы методом xajax->processRequests().
Вы удивитесь 'Ну и что мы с этого получили?'.
Остался только один шаг для того чтобы доставить до клиентской стороны всю мощь языка PHP. После создания функций и установки объекта xAJAX мы можем отправлять HTML с сервера. Теперь мы добавим xAJAX на страницу HTML, для этого используем простой код, который должен располагаться в теге :
$objAjax->printJavascript();
Теперь мы можем закончить нашу страницу и использовать функции которые мы описали на первых шагах, напрямую со стороны клиента. В Для завершения нашего примера нам нужно взять элемент HTML с ID = 'my_element':
I'm gonna have my ass kicked by xajax!(этот юмор переводить не буду)
Если мы добавим ссылку на страницу вызывающую наши функции с сервера, то они выделят текст жирным шрифтом без перезагрузки. Вид этой ссылки приведен ниже: Kick his ass! Ура, мы сделали это! Мы создали нашу первую AJAX ссылку. Щелкните по ней, чтобы увидеть магию AJAX. Как вы можете увидеть функции с сервера всегда вызывается посредством javascript функции с таким же именем, только с префиксом xajax_. В нашем примере мы вызываем xajax_makeBold().
Мы используем document.getElementById('my_element') для изменения содержания элемента HTML. Мы можем определить содержание этого элемента как заключенного в теги и . Двигаемся дальше Это всё? По основам, все! Это действительно легко. Конечно, немного больше вы узнаете, дочитав статью до конца, основные принципы вы уже получили. Теперь продемонстрируем мощь библиотеки и легкость использования в полнофункциональном приложении.
Демонстрации имеют полностью документированный код с понятными объяснениями, как это все работает. Поэтому если статья вас заинтересовала создайте мини сайт и посмотрите xAJAX в действии.
Посмотреть демо сайт!
И в заключении Если вы могли заметить, при прочтении этой статьи, что создание сайтов на AJAX не так сложно, как вы могли себе представить. Библиотека xAJAX сделана на границе Ajax и PHP, что позволяет писать приложения почти также легко как и на обычном PHP. Конечно, есть множество других библиотек, которые определенно стоит посмотреть. Я просто выбрал xajax потому что его можно непринужденно использовать, и при этом имеет такие большие возможности. Я надеюсь что эта статья будет для вас полезна.
Счастливо поAJAXить!
Обновлено: Дж. Макс Вилсон, создатель xajax сообщил прекрасную новость:
Привет. Я создатель php библиотеки xAJAX. Спасибо за презентацию (прим. перев. : автор проводил презентацию xAJAX)! Сейчас мы ведем сложную работу над новым релизом xAJAX. Мы выпускаем бета версию на следующей неделе. Новые изменения включают: Новая обработка ошибок: Ошибки, которые не являются критическими могут теперь скрываться и записываться только в лог файл или показываться пользователю в предупреждениях. ООП: Вы теперь можете регистрировать объекты и статические методы для вызова через xAJAX.
Эта особенность делает xAJAX легким для применения в различных ООП CMS-разработках (CMS – система управления сайтом). Локализация: xajax по умолчанию использует UTF-8, но мы добавляем возможность определять нужную вам кодировку. Регистрация внешних функций: вы можете теперь регистрировать функции во внешних файлах .php и xajax будет динамически включать файл и вызывать функцию только если она запрошена. Мы имеем сообщество разработчиков, использующих xajax.
Оригинал www.i-marco.nl/weblog/archive/2005/11/12/easy_ajax_for_the_masses_with
Автор: Марко Ван Хилкам
Перевод: Федоринов Григорий
Источник: www.myjoomla.ru
Рекомендуем почитать
