How to save event when custom button is clicked on the scheduler's editor window?

[Dimitris]

Hello,

In the scheduler's editor window we've added a custom button, like so:

let buttons = dialogObj.buttons;
buttons.unshift({
    buttonModel:{
        content:"Convert",
        isPrimary:false,
        cssClass:"e-custom-btn1"
},
    click: convertToVisit.bind(args)
});
dialogObj.setProperties({
    buttons: buttons
});

In convertToVisit method we would like to save the event prior to executing our custom logic. We have tried to simulate saving by invoking the click method of the Save button:

function convertToVisit(args){
if((/Mobi|Android/i.test(navigator.userAgent))){
        document.querySelector('.e-dlg-header-content .e-dlg-header .e-title-header .e-save-icon').click();
}
else{
        document.querySelector('.e-schedule-dialog .e-event-save').click();
}
...
}

But the above code is clumsy. Getting reference of the Save button depends on the browser and device's style and it is not a safe assumption.

Is there any better / more standard way to call the default save method of the edit window?

[Ravikumar Venkatesan]

Hi Dimitris,

Sample: https://www.syncfusion.com/downloads/support/directtrac/general/ze/ej2_core_schedule_editor_custom_button_sample1503584676

You can save the event when the custom button is clicked with help of the eventSave method as shown in the below code snippet.

[index.cshtml]

<script type="text/javascript">

    function onPopupOpen(args) {

        if (args.type === 'Editor' && !args.element.querySelector(".e-custom-btn")) {

            const dialogObj = args.element['ej2_instances'][0];

            let buttons = dialogObj.buttons;

            buttons.unshift({

                buttonModel: {

                    content: "Convert",

                    isPrimary: false,

                    cssClass: "e-custom-btn"

                },

                click: convertToVisit.bind(args)

            });

            dialogObj.setProperties({ buttons: buttons });

        }

    }

 

    function convertToVisit(args) {

        var scheduleObj = document.querySelector('.e-schedule').ej2_instances[0];

        scheduleObj.eventWindow.eventSave(scheduleObj.eventWindow);

    }

</script>

Regards,

Ravikumar Venkatesan

[Dimitris]

Hi,

Great, thank you very much.

[Ravikumar Venkatesan]

Dimitris,

Let us know if you need any further assistance on this.