Angular Schedule - Sorting Grouped Items

[Sean]

I am using grouping on my schedule item with parent/child grouping using the following resource definitions:

      <e-resources>
        <e-resource field="serviceTerritoryId" title="ServiceTerritory" name="ServiceTerritories" [dataSource]="serviceTerritoryDataSource"
                    textField='serviceTerritoryName' idField='serviceTerritoryId'>
        </e-resource>
        <e-resource field="resourceId" title="Resource" name="Resources" [dataSource]="resourceDataSource"
                    [allowMultiple]="allowMultipleResource" textField='resourceName' idField='resourceId' groupIDField='serviceTerritoryId'>
        </e-resource>
      </e-resources>

I have sorted both resource data sources, I have sorted the schedule items this is bound to using a sort field "{serviceTerritoryName}-{resourceName}".  When I look at the items they are sorted correctly in the source, but when rendered in the browser they are no longer sorted.

Is there a way to sort these items?  First by parent group, then by child group?  As seen below, it should be NorthEast, NorthWest then SouthEast.

Thank you!

[Balasubramanian Sattanathan]

Hi Sean, 

  

Greetings from Syncfusion Support. 

  

We have validated your requirement at our end and let you know that we can sort the resource datasource by using the below code snippet. We have prepared a sample for your reference which can be available from the below link. 

  

https://stackblitz.com/edit/angular-schedule-resource-data-sorting?file=app.component.ts 

  

public projectDataSource: Object[] = [ 

  { text: 'NorthWest', id: 1, color: '#cb6bb2' }, 

  { text: 'NorthEast', id: 2, color: '#56ca85' } 

]; 

public sorted_projectDataSource = this.projectDataSource.sort(function (a, b) { 

  if ((a as any).text < (b as any).text) { return -1; } 

  if ((a as any).text > (b as any).text) { return 1; } 

  return 0; 

}); 

public categoryDataSource: Object[] = [ 

  { text: 'Nancy', id: 1, groupId: 1, color: '#df5286', designation: "Cardioligst" }, 

  { text: 'Margaret', id: 2, groupId: 1, color: '#7fa900', designation: "Neurologist" }, 

  { text: 'Robert', id: 3, groupId: 2, color: '#ea7a57', designation: "Orthopedic Surgeon" }, 

  { text: 'Laura', id: 4, groupId: 2, color: '#5978ee', designation: "Dentist" } 

]; 

public sorted_categoryDataSource = this.categoryDataSource.sort(function (a, b) { 

  if ((a as any).text < (b as any).text) { return -1; } 

  if ((a as any).text > (b as any).text) { return 1; } 

  return 0; 

}); 

Kindly refer to the above solution and let us know if you need further assistance. 

  

Regards,
Balasubramanian