管理者でのJavaScriptのカスタマイズ—Djangoドキュメント

管理者でのJavaScriptのカスタマイズ

インラインフォームイベント

管理者変更フォームでインラインフォームが追加または削除されたときに、JavaScriptを実行することをお勧めします。 formset:addedおよびformset:removed jQueryイベントはこれを可能にします。 イベントハンドラには、次の3つの引数が渡されます。

• 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 %}

app / static / app / formset_handlers.js

(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);

覚えておくべき2つのポイント：

• admin/change_form.htmlを継承している場合、JavaScriptコードはテンプレートブロックに配置する必要があります。そうしないと、最終的なHTMLでレンダリングされません。
• テンプレート:Block.superが追加されたのは、Djangoのadmin_change_form_document_readyブロックに変更フォームのさまざまな操作を処理するJavaScriptコードが含まれており、それもレンダリングする必要があるためです。

django.jQuery名前空間に登録されていない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 %}

app / static / app / unregistered_handlers.js

django.jQuery(document).on('formset:added', function(event, $row, formsetName) {
    // Row added
});

django.jQuery(document).on('formset:removed', function(event, $row, formsetName) {
    // Row removed
});