Настройки JavaScript в интерфейсе администратора ¶
События Subform ¶
Может быть желательно запустить код JavaScript, когда подчиненная форма добавляется или удаляется в форме редактирования сайта администрирования. События JQuery formset:added
и formset:removed
позволяют вам это делать. Обработчик событий получает три параметра:
event
это событие jQuery.$row
- добавленная (или удаленная) строка.formsetName
- набор форм, которому принадлежит строка.
Событие вызывается с использованием пространства имен django.jQuery .
В своем change_form.html
настраиваемом шаблоне расширьте блок admin_change_form_document_ready
и добавьте функцию прослушивания с помощью этого кода:
{% extends 'admin/change_form.html' %}
{% load static %}
{% block admin_change_form_document_ready %}
{{ block.super }}
<script src="{% static 'app/formset_handlers.js' %}"></script>
{% endblock %}
(function($) {
$(document).on('formset:added', function(event, $row, formsetName) {
if (formsetName == 'author_set') {
// Do something
}
});
$(document).on('formset:removed', function(event, $row, formsetName) {
// Row removed
});
})(django.jQuery);
Следует помнить о двух вещах:
- Код JavaScript должен находиться в блоке шаблона, если вы наследуете от
admin/change_form.html
, иначе он не будет создан в окончательном HTML-коде. {{ block.super }}
добавлен, потому что блокadmin_change_form_document_ready
содержит код JavaScript для обработки различных операций в форме редактирования, и нам нужно, чтобы это содержимое тоже отображалось.
Иногда бывает полезно работать с плагинами jQuery
, которые не зарегистрированы в пространстве имен django.jQuery
. Для этого измените способ, которым код ожидает событий. Вместо того, чтобы заключать слушателя в пространство имен django.jQuery
, слушайте событие, которое возникает оттуда. Например :
{% extends 'admin/change_form.html' %}
{% load static %}
{% block admin_change_form_document_ready %}
{{ block.super }}
<script src="{% static 'app/unregistered_handlers.js' %}"></script>
{% endblock %}
django.jQuery(document).on('formset:added', function(event, $row, formsetName) {
// Row added
});
django.jQuery(document).on('formset:removed', function(event, $row, formsetName) {
// Row removed
});