Django forms - как сделать неактивным виджет при выборе одной из опций в ChoiseField, например?

Django forms - как сделать неактивным виджет при выборе одной из опций в ChoiseField ? то есть у меня есть виджет ChoiseField , в нём два условия. И нужно при выборе одного из условий чтобы деактивировалось другое поле, например TextField. Скриншот с примером формы и Что должно быть в итоге

В Django, для создания формы с динамическим поведением - как деактивация поля при выборе опции в ChoiceField, можно использовать JavaScript в сочетании с Django формами

<!-- Пример кода для формы -->
<form id="myForm" method="post" action="{% url 'my_url' %}">{% csrf_token %}
    {{ form.my_choice_field }}
    {{ form.my_text_field }}
</form>
    <script>
document.addEventListener('DOMContentLoaded', function() {
    const choiceField = document.getElementById("id_my_choice_field");
    const textField = document.getElementById("id_my_text_field");
choiceField.addEventListener('change', function() {
        if (choiceField.value === 'option_A') {
            textField.disabled = true;  // Деактивация поля
        } else {
            textField.disabled = false;  // Активация поля
        }
    });
});
</script>

Вот такое решение помогло: Добавляем такой класс в файле admin.py в вашем классе

@admin.register(Ваша_модель)
class Ваша_модель_Admin(admin.ModelAdmin):

(Запятая в конце обязательна, потому что это кортеж -без неё будет ошибка):

   class Media:
        js = (  'path_to_file/js/disable_db_widget.js',)

и такой скрипт (может кому-то пригодится):

(function($) {

        console.log('From test3.js ');


    $(document).ready(function() {

        $('#id_IS_PATH').change(function() {

            if ($(this).val() == '1' || $(this).val() == '2') {

                console.log($(this))


                $('#id_DB_SERVICE').attr('disabled', true);
                $('#id_DB_SERVICE').closest('.form-row').addClass('disabled-field');
                $('#id_DB_SERVICE').val( '41');
            } else {
                $('#id_DB_SERVICE').attr('disabled', false);
                $('#id_DB_SERVICE').closest('.form-row').removeClass('disabled-field');
            }
        });
    });
})(django.jQuery);
Вернуться на верх