Editor Dialog Remove AM/PM from StartTime and EndTime Dropdown

[Swarupa N]

Hi,

with the following implementation I an able to set the time format for start time without AM/PM on input field,

(args.element.querySelector(".e-start") as any).ej2_instances[0].format = "HH:mm";

How to set same format on time selection drop down on editor dialog?

[Satheesh Kumar Balasubramanian]

Hi Swarupa, 

  

Thanks for using Syncfusion Products. 

  

We have validated your reported query "How to set same format on time selection drop down on editor dialog?" and suspect that you need to change the time format on the pop-up in the Start and End time DateTimePicker. We have prepared the sample using DateTimePicker timeFormat property in Dialog open event to achieve your requirement which can be viewed from the following link.  

  

Sample: https://stackblitz.com/edit/angular-schedule-timeformat-customize?file=app.component.ts 

 

API: https://ej2.syncfusion.com/angular/documentation/api/datetimepicker/#timeformat 

  

app.component.ts:   

  onPopupOpen(args: PopupOpenEventArgs): void { 

    if (args.type === 'Editor') { 

      let dialog = (document.querySelector('.e-schedule-dialog') as any) 

        .ej2_instances[0]; 

      dialog.open = e => { 

        let startTimeObj = e.element.querySelector('.e-start.e-datetimepicker') 

          .ej2_instances[0]; 

        let endTimeObj = e.element.querySelector('.e-end.e-datetimepicker') 

          .ej2_instances[0]; 

        startTimeObj.format = 'dd-MMM-yy HH:mm'; 

        startTimeObj.timeFormat = 'HH:mm'; 

        endTimeObj.timeFormat = 'HH:mm'; 

        endTimeObj.format = 'dd-MMM-yy HH:mm'; 

      }; 

    } 

  } 

  

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

   

Regards,  

Satheesh Kumar B