We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

Editor window customizing

Thread ID:





145975 Jul 16,2019 01:04 PM UTC Jul 18,2019 11:01 AM UTC Angular - EJ 2 3
Tags: Schedule
Asked On July 16, 2019 01:04 PM UTC

hello, i would like to says thank you for you angular schedular it has awsome features but i am having troubles with costumizing editor window so when i click on the save button it dosen't work i would like to know how can i set my function when i click on the save button in editor window,
i followed the documentation i even tried the same exemples but none of them works with me.
i would like to mention that the save button in the quick popup works and when i add a new event its displayed correctlly on the schedular
any suggestion please !

Karthigeyan Krishnamurthi [Syncfusion]
Replied On July 17, 2019 09:34 AM UTC

Hi Marwa, 
Syncfusion greetings. 
We suspect that editor is not customized properly which could be the cause. Kindly refer the below links to customize the editor using template option. 

Replied On July 17, 2019 10:13 AM UTC

thank you for your quick response,
 but i tries those examples but it didn't work for me here my code could help me please

Attachment: 1_ea36f327.zip

Karthigeyan Krishnamurthi [Syncfusion]
Replied On July 18, 2019 11:01 AM UTC

Hi Marwa, 
Thanks for the update. 
In your sample, resource option is used but in editor template, resource field is not added which is the cause. We have prepared the below sample and refer the UG link. 
      <e-resource field="OwnerId" title="Owner" name="Owners" [dataSource]="ownerDataSource" textField="text" idField="id" colorField="color"> 
                        <td class="e-textlabel">Owner</td> 
                        <td colspan="4"> 
                            <input type="text" id="OwnerId" name="OwnerId" class="e-field" style="width: 100%" /> 
onPopupOpen(args: PopupOpenEventArgs): void { 
    if (args.type === 'Editor') { 
      let startElement: HTMLInputElement = args.element.querySelector('#StartTime') as HTMLInputElement; 
      if (!startElement.classList.contains('e-datetimepicker')) { 
        new DateTimePicker({ value: new Date(startElement.value) || new Date() }, startElement); 
      let endElement: HTMLInputElement = args.element.querySelector('#EndTime') as HTMLInputElement; 
      if (!endElement.classList.contains('e-datetimepicker')) { 
        new DateTimePicker({ value: new Date(endElement.value) || new Date() }, endElement); 
      let processElement: HTMLInputElement = args.element.querySelector('#OwnerId'); 
      if (!processElement.classList.contains('e-multiselect')) { 
        let multiSelectObject: MultiSelect = new MultiSelect({ 
          placeholder: 'Choose a owner', 
          fields: { text: 'text', value: 'id' }, 
          dataSource: <any>this.ownerDataSource 


This post will be permanently deleted. Are you sure you want to continue?

Sorry, An error occured while processing your request. Please try again later.

Please sign in to access our forum

This page will automatically be redirected to the sign-in page in 10 seconds.

Warning Icon You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.Close Icon

Live Chat Icon For mobile
Live Chat Icon