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

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

You may want to execute some JavaScript when an inline form is added or removed in the admin change form. The formset:added and formset:removed events allow this. event.detail.formsetName is the formset the row belongs to. For the formset:added event, event.target is the newly added row.

Changed in Django Development version:

В старых версиях событие представляло собой событие jQuery с параметрами $row и formsetName. Теперь это JavaScript CustomEvent с параметрами, заданными в event.detail.

В пользовательском шаблоне 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 %}
app/static/app/formset_handlers.js
document.addEventListener('formset:added', (event) => {
    if (event.detail.formsetName == 'author_set') {
        // Do something
    }
});
document.addEventListener('formset:removed', (event) => {
    // Row removed
});

Следует иметь в виду два момента:

  • Код JavaScript должен находиться в блоке шаблона, если вы наследуете admin/change_form.html, иначе он не будет отображен в конечном HTML.
  • {{ block.super }} добавлен потому, что блок Django admin_change_form_document_ready содержит код JavaScript для обработки различных операций в форме изменений, и нам нужно, чтобы он тоже был отображен.

Поддержка версий Django старше 4.1

Если ваш приемник событий все еще должен поддерживать старые версии Django, вы должны использовать jQuery для регистрации вашего приемника событий. jQuery обрабатывает события JavaScript, но обратное не верно.

Можно проверить наличие event.detail.formsetName и вернуться к старой сигнатуре слушателя следующим образом:

function handleFormsetAdded(row, formsetName) {
    // Do something
}

$(document).on('formset:added', (event, $row, formsetName) => {
    if (event.detail && event.detail.formsetName) {
        // Django >= 4.1
        handleFormsetAdded(event.target, event.detail.formsetName)
    } else {
        // Django < 4.1, use $row and formsetName
        handleFormsetAdded($row.get(0), formsetName)
    }
})
Вернуться на верх