Use <input type="date"> to choose date outside of the scheduler

[gms-fitri]

Hello,

Most of the tutorial and documentations indicates that we can simply click on any time slot on the respective date to create an appointment.

I need to use a outside of the scheduler (not using date picker in scheduler) to select date, and then need to choose a time in a scheduler (pretty much like the attachment provided).

How can I be able to do that?

Attachment: pickOutside_8b661c54.zip

[Ruksar Moosa Sait]

Hi Gms,

We have prepared a sample to open the Editor window on the scheduler for the date picked from the Date Picker by binding the ‘startTime’ and ‘endTime’ values on onChange method like the below code snippet.

function onChange(args) {

        var scheduleObj = document.getElementById('schedule').ej2_instances[0];

        var endTime = new Date(args.value.getTime() + 30 * 60000);

        var cellData = {

            startTime: args.value,

            endTime: endTime,

        };

        scheduleObj.openEditor(cellData, 'Add');

    };

<ejs-datepicker id="datepicker" value="new DateTime(DateTime.Today.Year, 1, 10)" change="onChange" ShowClearButton="false" placeholder="Choose Date" floatLabelType="Always"></ejs-datepicker>

Kindly try the above solution and let us know if this meets your requirement.

Regards,

Ruksar Moosa Sait