JavaScript-настройки в админке

События встроеных форм

Вы можете выполнить 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 type="text/javascript" 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 }} добавляется, потому что блок Django 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 type="text/javascript" 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
});