two resource and textfield search for the customer or user | Angular

[juan manuel espalza mora]

Hello how are you?
I am implementing schedule in my project and I am using the default template to create an event but I have two doubts.
1. can only add one <e-resource>? since when I add the second it indicates that it does not find the id
2. Can you also add another text field where I can search for the customer or user for whom I want to schedule an event? (apart from the person attending the event)

[Ravikumar Venkatesan]

Hi Juan, 

  

Greetings from Syncfusion support. 

  

Can only add one <e-resource>? since when I add the second it indicates that it does not find the id 

We have validated your above query at our end. We can add multiple levels of resources with the ej2 angular Schedule. We have prepared a sample with the two-level of resources which can be available below. 

  

UG(Grouping with the multi-level resources): https://ej2.syncfusion.com/angular/documentation/schedule/resources/#grouping-multi-level-resources 

  

  

Can you also add another text field where I can search for the customer or user for whom I want to schedule an event? 

We have validated your above requirement at our end. We have added an additional field that allows us to choose the customer with the help of the editorTemplate property of the Schedule as shown in the below code. We have prepared a sample for your reference and it can be available below. 

   

API(editorTemplate): https://ej2.syncfusion.com/angular/documentation/api/schedule/#editortemplate 

UG(editorTemplate): https://ej2.syncfusion.com/angular/documentation/schedule/editor-template/#customizing-event-editor-using-template 

  

[app.component.html] 

<ejs-schedule width="100%" height="550px" [selectedDate]="selectedDate" [views]="views" [eventSettings]="eventSettings" [group]='group'> 

  <ng-template #editorTemplate let-data> 

    <table *ngIf="data != undefined" class="custom-event-editor" width="100%" cellpadding="5"> 

      <tbody> 

        <tr> 

          <td class="e-textlabel">Customer</td> 

          <td colspan="4"> 

            <ejs-dropdownlist id='customer' class="e-field" data-name="Customer" placeholder='Choose Customer' 

              [dataSource]='customers' [allowFiltering]='true' [fields]='customerFields' value='{{data.Customer}}'> 

            </ejs-dropdownlist> 

          </td> 

        </tr> 

      </tbody> 

    </table> 

  </ng-template> 

</ejs-schedule> 

 

  

Sample: https://www.syncfusion.com/downloads/support/forum/161055/ze/ej2-angular-schedule-with-multi-level-resources-and-editor-template1134225325 

 

Kindly try the above sample and get back to us if you need any further assistance. 

  

Regards, 

Ravikumar Venkatesan