I use JQuery formset librairy to manage django inline formsets in my forms. I can add new formset using 'add' button and suppress formset using 'delete' buttons (django-inline-formet).

But I have added "lock/unlock" functionality to my forms that disabled all fields when lock button (id = lock) is clicked.

So, when form is "locked", fields are disabled and 'add' and 'delete' buttons must also be hidden. I manage to show/hide buttons on lock button click by user.

But, when form is locked and page is reloaded by user (F5), 'add' and 'delete' buttons are displayed. It seems that code in function executed with document.ready is not fire.

But if I 'manually execute' the code it works.

What I have missed?

function disabled_field(action) {

    $('#form').find(':input').not(':button,:hidden').each(function () {
        if (action == 'locked') {
            $(this).prop('disabled', true);
        } else {
            // only if user has write privilege on form
            if ($('#is_locked').data('add-privileges') === 'True') {
                $(this).prop('disabled', false);
            }
        }
    });
}

//index of the last empty formset added with 'extra' inlineforsmet parameters
var index = formsetnumber() - 1;

/* lock a form */
$("body").on("click", '#lock', function (event) {
    
    // form is locked => hide inlineformset buttons
    if ($('#lock').attr('aria-pressed') == 'false') {

        // hide all formset delete button
        $(".visit-delete").each(function () { $(this).hide() });
        // hide add-row button
        $(".add-row").hide();
        // hide the last empty formset added with 'extra' inlineforsmet parameters
        $("#div_id_evenement_visite-"   index   "-vis_eve_num").closest(".row").hide();

    } else {

        // show all formset delete button
        $(".visit-delete").each(function () { $(this).show() });
        // show add-row button
        $(".add-row").show();
        // show the last empty formset added with 'extra' inlineforsmet parameters
        $("#div_id_evenement_visite-"   index   "-vis_eve_num").closest(".row").show();
    }

// when page is refreshed (F5) => currently, it dosen't works and add/delete buttons are displayed
$(document).ready(function () {

    // form is locked => hide inlineformset buttons
    if ($('#lock').attr('aria-pressed') == 'false') {
        // hide all formset delete button
        $(".visit-delete").each(function () { $(this).hide() });
        // hide add-row button
        $(".add-row").hide();
        // hide the last empty formset added with 'extra' inlineforsmet parameters
        $("#div_id_evenement_visite-"   index   "-vis_eve_num").closest(".row").hide();

    } else {

        // show all formset delete button
        $(".visit-delete").each(function () { $(this).show() });
        // show add-row button
        $(".add-row").show();
        // show the last empty formset added with 'extra' inlineforsmet parameters
        $("#div_id_evenement_visite-"   index   "-vis_eve_num").closest(".row").show();    
    }
});

CodePudding user response：

'add' and 'delete' are dynamically added with JS using django-inline-formset librairy so buttons may be not available when page is loaded/reloaded. You have to 'wait' for elements to be loaded before trying to show/hide. Code from Chris Jhoughton I usually use when I face this problem. Hope this help.