jQuery code no executed after closing and opening ‘frappe.ui.Dialog’

Frappe Framework Customization
1

I have created frappe.ui.Dialog with HTML field .
After I render html with frappe.render_template , th dialog opens. I successfully do my action, with button click event etc in jQuery.
BUT, after I close thie Dialog and reopen it again, the button click event are not triggered.

This is a code sample:

frappe.ui.form.on('Quotation', {
    'refresh': function (frm, cdt, cdn) {
        
    },
    'quick_quotation_btn': function (frm, cdt, cdn) {
        let doc = locals[cdt][cdn];

        let rendered_template = frappe.render_template("paste_quote", {'data': 'ds'});

        /*
        Init Dialog
        */
        let dialog = new frappe.ui.Dialog({
            title: __('Quick Quote'),
            fields: [
                {
                    fieldtype: 'HTML',
                    fieldname: 'alt_item_name',
                    label: __(''),
                    reqd: false,
                    description: __(""),
                    options: rendered_template
                }
            ]
        });
        dialog.show();
        dialog.$wrapper.find('.modal-dialog').css("width", "50%");

        /*
        This button click event is in rendered_template html
        */
        $("#generate_table").click(function () {
            console.log('OK')
        }
    }
    }
});
1 Like
2

Inject your table separately after show. the options is rendered only at the time of creation.

3 
$('document').on('click', '#generate_table', function(){
    console.log('OK');
});
4

The button is rendered on options, while the table is generated when I click the button.

5

Thanks. It works but with one problem. When I close an open for the second time the dialog, the button is clicked 2 times, if I close and open for the 3rd time the button is clicked 3 times, 4th time the button is clicked 4 times, as so forth. :confused:

6 
$('document').off('click').on('click', '#generate_table', function(){
    console.log('OK');
});
1 Like
7

Great, works. A minor bug that I forgot to mention earlier. It should be $(document) not $('document') .

Thanks a lot.

1 Like