Ajax - организация ajax запросов

Ajax - организация ajax запросов

Специальный атрибут data-ajax для выполнения ajax-запросов и подстановки возвращённых данных в темплейт с адресацией вставки с помощью селектора. Если в атрибуте data-ajax явно не указан путь к ajax обработчику, то происходит обращение к обработчику /engine/ajax.php. Ajax запрос активизируется по событию click.

Для работы данной инструкции к темплейту необходимо подключить файл: /engine/js/functions.js

Значения атрибутов:

  • data-ajax - указывает путь к обработчику ajax запроса
  • data-html - селектор указывающий в какой тег поместить возвращённый запросом контент
  • data-after - селектор указывающий после какого тега поместить возвращённый запросом контент
  • data-before - селектор указывающий перед каким тегом поместить возвращённый запросом контент
  • data-append - селектор указывающий в какой тег после имеющегося контента добавить возвращённый запросом контент
  • data-prepend - селектор указывающий в какой тег перед имеющимся контентом добавить возвращённый запросом контент
  • autoload - если в атрибут autoload передано значение true то выполнение ajax запроса происходит автоматически, не дожидаясь события click

Пример:

<a href="#" data-ajax="mode=list&form=page" data-html="div.main">
Страницы
<span class="btn btn-navbar glyphicon glyphicon-plus-sign add-item" 
   data-ajax="mode=edit&form=page&id=_new" 
   data-toggle="modal" data-target="#pageEdit" 
   data-html="#pageEdit .modal-body">
</span></a>

Пример:

<a href="#" data-ajax="/module/myajax.php?mode=listview&form=objects" 
   data-html="div.content">
   Показать объекты
</a>

Интеграция с Bootstrap v.3

Чистый & понятный код

Парсер DOM в PHP