Варианты использования технологии ajax в Joomla 2.5

Как известно, Ajax это определенная технология фонового обмена информацией браузера с сервером без перезагрузки всего содержимого страницы. Описывать саму технологию и как она работает я не буду, статей на эту тему и так предостаточно. Рассмотрим использование технологии ajax применительно к CMS Joomla 2.5 с использованием JQuery (это один самых простых вариантов, плюс кроссплатформенность обеспечена).

1. Ajax без использования фрэймворка Joomla (все функции, например, работа с базой данных, получение информации о пользователях пишем своими руками)
2. Ajax + фрэймворк Joomla 2.5 (имеем возможность использовать API джумлы, например, для получения информации о пользователе смело можем использовать код: $user = JFactory::getUser)
3. Ajax + полноценное использование всех возможностей Joomla 2.5, включая MVC (модель-вью-контроллер)

Ajax без использования фрэймворка Joomla 2.5

Все примеры будем рассматривать с данными Joomla 2.5, которые ставятся при ее инсталляции, шаблон по умолчанию «Beez_20». Для начала в какой-нибудь части шаблона вставим функцию на javascript, которая отправляет запрос на сервер с помощью jquery. Выглядеть она будет слеудющим образом:

function zapros() {                     if (window.jQuery)                         {                          alert("jquery загружен");  //окно сигнализирует, что jquery загружен и готов к использованию                         $.ajax({  //функция jquery                             type: "POST",                            url: "ajax.php",  //файл в корне сайта с информацией                            data: "mydata=data", //данные для сервера                            success: function(tut_dannye_ot_servera){  //данная функция вызывается при усппешной отработке запроса                                    alert( "Data Saved: " + tut_dannye_ot_servera );  //окно сигнализирует, что пришел ответ и показывает, что нам передал сервер                                    $('#korzina').replaceWith( tut_dannye_ot_servera );  //функция jquery помещает ответ в место с id=#korzina                                         }                                 });                              } }  

также, куда-нибудь в шаблон, компонент либо модуль вставляем кнопку

<input type="button" name="Sub" class="button" value=жмите_сюда onclick = zapros() <div id=korzina></div> 

файл ajax.php, например, выглядит следующим образом

<?php Echo “ответ  сервера”; ?> 

В результате, при нажатии на кнопку «жмите_сюда», на сервер отправится «POST» запрос с данными «mydata=data». На сервере будет открыт файл «ajax.php», в котором на PHP вы можете писать любой код, и вся выданная информация на отображение будет передана вашему сайту в переменную «tut_dannye_ot_servera». Затем, с помощью функции jquery ".replaceWith()", содержимое переменной помещаем в место, где ранее был тег с id=#korzina.
В данном варианте реализации механизма Joomla 2.5 + ajax мы, увы, не можем использовать все прелести, которые дает нам фрэймворк Joomla. Все придется писать своими ручками.

Ajax + фрэймворк Joomla 2.5

При такой реализации, все остается, как в предыдущем варианте, только файл ajax.php будет выглядеть по другому

<?php define('_JEXEC', 1); define('DS', DIRECTORY_SEPARATOR);  if (file_exists(dirname(__FILE__) . '/defines.php')) { 	include_once dirname(__FILE__) . '/defines.php'; }  if (!defined('_JDEFINES')) { 	define('JPATH_BASE', dirname(__FILE__)); 	require_once JPATH_BASE.'/includes/defines.php'; }  require_once JPATH_BASE.'/includes/framework.php';  $app = JFactory::getApplication('site'); $app->initialise();  $user = JFactory::getUser; Echo “ответ  сервера”; ?> 

Теперь мы можем использовать API функции Joomla 2.5

Ajax + полноценное использование всех возможностей Joomla 2.5, включая MVC (модель-вью-контроллер)

Чтобы не создавать лишних модулей, но, при этом было бы понятно, как все работает, рассмотрим данный пример на модуле «Breadcrumbs». Он выводится в основном шаблоне «Beez_20» на позиции

<jdoc:include type="modules" name="position-2" /> 

изменять его код нам не понадобиться. Шаблон «Atomic» изменим так, чтобы он выглядел следующим образом:

<?php defined('_JEXEC') or die; echo 'получено по ajax'; ?>    <jdoc:include type="modules" name="position-2" />  

Функция инициирующая запрос по ajax будет выглядеть так

function zapros() {                     if (window.jQuery)                         {                          alert("jquery загружен");  //окно сигнализирует, что jquery загружен и готов к использованию                         $.ajax({  //функция jquery                             type: "POST",                            url: "index.php",                              data: "template=atomic ", //данные для сервера                            success: function(tut_dannye_ot_servera){  //данная функция вызывается при усппешной отработке запроса                                    alert( "Data Saved: " + tut_dannye_ot_servera );  //окно сигнализирует, что пришел ответ и показывает, что нам передал сервер                                    $('.breadcrumbs').replaceWith( tut_dannye_ot_servera );  //функция jquery помещает ответ в место с class=breadcrumbs                                         }                                 });                              } }  

Как видим, в функции изменились отправляемые данные (мы посылаем другой шаблон), также место куда нужно поместить результат (.breadcrumbs). И самое главное, файл который будет открываться при запросе на сервере «index.php».
В результате Вы увидите, что при нажатии кнопки, инициирующей запрос, у Вас изменится содержимое «Breadcrumbs».

Представьте, что вместо «Breadcrumbs» у Вас корзина заказов. При таком подходе не требуется писать разный код для вывода ее обычным образом и через ajax. Достаточно иметь определенный шаблон, который Joomla будет использовать для отправки результата. При этом не нужно плодить шаблоны для каждого модуля. Все можно реализовать в одном шаблоне.