Очень часто перед выполнением ajax запроса нужно добавить какому-то элементу определённый класс, а после получения ответа убрать его, чтобы например показать какую-нибудь анимашу, мол keep calm и всё такое.
Реализовать можно с помощью создания собственного типа ajax-прогресса:
(function ($) {
if (Drupal.ajax) {
var ajaxBeforeSend = Drupal.ajax.prototype.beforeSend;
var ajaxSuccess = Drupal.ajax.prototype.success;
var ajaxError = Drupal.ajax.prototype.error;
Drupal.ajax.prototype.beforeSend = function(xmlhttprequest, options) {
ajaxBeforeSend.apply(this, arguments);
if (this.progress.type == 'class') {
this.progress.targetElement = $(this.progress.target);
this.progress.targetElement.addClass(this.progress.class);
}
};
Drupal.ajax.prototype.success = function(response, status) {
ajaxSuccess.apply(this, arguments);
if (this.progress.type == 'class') {
this.progress.targetElement.removeClass(this.progress.class);
}
};
Drupal.ajax.prototype.error = function(xmlhttprequest, uri, customMessage) {
ajaxError.apply(this, arguments);
if (this.progress.type == 'class') {
this.progress.targetElement.removeClass(this.progress.class);
}
};
}
}(jQuery));
Использовать так:
$form['submit'] = array(
...
'#ajax' => array(
...
'progress' => array(
'type' => 'class', // Наш кастомный тип прогресса
'target' => '#my-form-id', // Селектор элемента, на который будет навешиваться класс
'class' => 'ajax-loading', // Класс
),
),
);
Написанное актуально для
Drupal 7
Похожие записи
- Отключить автоматический аплоад файлов у определённого поля
- Отсылка на сервер дополнительных данных в системном автокомплите
- Чиним onclick на ajax кнопках
- Восстанавливаем позицию текстового курсора при ajax обновлении формы
- Как выполнять свой js-код до или после любых AJAX запросов (изменение работы AJAX API)
Добавить комментарий