Our pure JavaScript Scheduler component


Post by sc_cor »

Hi,

With the current implementation once we make some changes to the Event Edit Modal and Click the Save Button, It will trigger the onAfterEventSave event and make things persist in the server. I need to alter the current implementation when the user clicks the save button, and It should open a Mat Dialog Box on top of the Scheduler Event Editor, and based on the input provided in the Dialog Box, it should either close both modal and execute the onAfterEventSave logic or close the Mat Dialog Box and keep open the Event Edit Modal.

Angular: 16
Scheduler Pro: 6.0.0-beta-1

Any clue how to achieve this?

Sample Illustration What I need to Achieve
Sample Illustration What I need to Achieve
bryntum-explain.png (58.02 KiB) Viewed 92 times

Post by mats »

Then you should listen to https://bryntum.com/products/scheduler/docs/api/Scheduler/feature/EventEdit#event-beforeEventSave which allows for async flows.

scheduler.on({
     beforeEventSave() {
        const result = await showYourPopup();

     // decide whether it's ok to save based on result 
     return true // false
 }
 });

Hope this helps!


Post by Animal »

Probably best to use a Popup because it will look the same:

scheduler.on({
    beforeEventSave() {
        const result = await showYourPopup();

        // Decide whether it's ok to save based on result being 0, 1 or 2
        // Meaning Cancel, Save only or Send & Save
        return true // false
     }
});

showYourPopup() {
    return new Promise(resolve => {
        const confirmPopup = this._confirmPopup || (this._confirmPopup = new Popup({
            modal : true,
            title : 'Do you want to send an SMS with updated info?',
            bbar  : {
                items : {
                    cancel : {
                        text : 'Cancel',
                        onClick() {
                            confirmPopup.hide();
                            resolve(0);
                        }
                    },
                    saveOnly : {
                        text : 'Save only',
                        onClick() {
                            confirmPopup.hide();
                            resolve(1);
                        }
                    },
                    sendAndSave : {
                        text : 'Send & Save',
                        onClick() {
                            confirmPopup.hide();
                            resolve(2);
                        }
                    }
                }
            }
        }));
    });
    confirmPopup.show();
}

Post by sc_cor »

Thank you for the support team :)


Post Reply