Как использовать AJAX-запросы в Magento

AJAX (Asynchronous JavaScript And XML — Асинхронный JavaScript и XML) – это уже достаточно устарелая, но очень популярная технология в Интернете, которая позволяет получать информацию с сервера, не перезагружая всю страницу (а обновляя только нужные блоки сайта).

В этом уроке мы рассмотрим практическое использование технологии AJAX в вашем собственном модуле, который разработан для CMS Magento.

 

 

Практика

1) Создайте контроллер в своем модуле по следующему адресу, например:

Namespace/ModuleName/controllers/AjaxController.php  

или создайте новый action (действие) в уже существующем контроллере.

 

2) Чтобы создать действие в контроллере, например indexAction(), добавьте этот код в файл контроллера:

 

public function indexAction() {    $this->loadLayout();    $this->renderLayout();  }  

 

3) Затем добавьте в файл обновления макета в теме, например,

app/design/frontend/ThemePackage/Theme/layout/ajax-layout.xml  

такой код:

 

<modulename_ajax_index>    <block type="modulename/block" name="root" template="path/to/template.phtml" />  </modulename_ajax_index>  

 

где нод modulename – это маршрутизатор фронтенда, ajax – это название контроллера, а index – название действия контроллера

 

4) После этого добавьте обновление макета в файле config.xml в папке etc модуля:

 

<layout>    <updates>      <modulename>        <file>ajax-layout.xml</file>      </modulename>    </updates>  </layout>  

 

5) После этого очистите кэш, и вы будете иметь доступ к экземпляру класса Block из файла-шаблона template.phtml

 

6) И, наконец, чтобы протестировать хорошую работу, вызываем Ajax контроллер с шаблона с помощью простого JavaScript, например:

 

xmlhttp.open("GET","/modulename/ajax/index/test/"+value,true);  

 

или же с помощью библиотеки jQuery:

 

jQuery.ajax({    url: "<?php echo $this->getUrl('modulename/ajax/index'); ?>",    type: "POST",    data: "size="+jQuery(this).val(),    success: function(data) {     jQuery('#results').html(data);    }  });