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

Editor window customizing

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 !

3 Replies

KK Karthigeyan Krishnamurthi Syncfusion Team 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. 

MA marwa 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

KK Karthigeyan Krishnamurthi Syncfusion Team 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 

Live Chat Icon For mobile
Up arrow icon