Bryntum Support Forums

Hello and thank you for your kind help. I do have the following simple grid:

I want people to click the checkbox BUT before that, I want a dialog to appear saying: "are you sure? " (or another msg), if they do not confirm then nothing happens, I hope make sense what I said.

So for all other columns, I'm using "finalizeCellEdit" and it works as expected, now on the checkbox column, I tried to use it and simply does nothing, even if finalizeCellEdit is listed as a valid property, so I decided to take another approach using beforeToggle event, and it works only if it runs synchronously and I need this to be async, as I have to wait for the answer of the user, here's a sample of my code:

Any help on this situation will be appreciated. Thank you.

For now you would need to return false from beforeToggle, save a reference to the record / checkbox and show your popup and then set the checked value based on the user input.

ok, let me see if I understood... so I should always return false, that's the easy part, then... create another function and send a reference of the record? then update accordingly? would you please provide an example? thanks for your help.

May I ask why finalizeBeforeEdit is not working???

Ok... any example on how to do this? how do I put a confirmation before accepting checkbox new value? thanks for all your help.

Try:

 {
                type      : 'check',
                field     : 'done',
                flex      : 2,
                listeners : {
                    beforeToggle({ checked, record }) {
                        const result = MessageDialog.confirm({
                            title   : 'Please confirm',
                            message : 'Did you want this?'
                        }).then(result => {
                            if (result === MessageDialog.okButton) {
                                record.done = checked;
                            }
                        });
                        return false;
                    }
                }
            },

Mr Mats, thank you for the great sample and your patience, we still have more question but this one is resolved I think.

PD. for other people, record.done does not exist, that is RECORD.YOURFIELD = true in this case, so you are not looking for this DONE option.

Hi Mats,
The above code is not working when I try to implement on the advanced example provided by Bryntum.
Please refer to the recoding using the link : https://frontrol-my.sharepoint.com//p/cgupta/EYdzTia8qjRFtrcn7EepWRQBCJfu16Q29pD_ahzjTjOf0g?e=TDlgbj

{
                type      : 'check',
                field     : 'done',
                flex      : 2,
                listeners : {
                    beforeToggle({ checked, record }) {
                        const result = MessageDialog.confirm({
                            title   : 'Please confirm',
                            message : 'Did you want this?'
                        }).then(result => {
                            if (result === MessageDialog.okButton) {
                                record.done = checked;
                            }
                        });
                        return false;
                    }
                }
            },

Hi,

You need to import the MessageDialog

Then, it will be working as expected

its working