Custom sorting in Flexgrid in Angular 2

Custom sorting in Flexgrid in Angular 2

Posted by: vinaybietpratap on 24 September 2020, 3:17 am EST

• 

  vinaybietpratap

  • Post Options:
  • Link
    Copy

  Posted 24 September 2020, 3:17 am EST

  Hi,

  I am feeding data to Flexgrid as string even numbers, decimals also as string. But now the sorting for numbers are happening as string which is causing problem. So I want to write a custom sorting function to sort the columns according to the datatype. I am having the datatype of every column. Let me know is there a way to write a custom sorting function instead of default one to avoid the string sorting on number columns.

• 

  sharad.tomer

  

  • Post Options:
  • Link
    Copy

  Posted 25 September 2020, 8:47 am EST

  Hi Vinay,

  You may assign a comparer function to the grid’s collectionView to implement custom sorting. Please refer to the following code snippet:

  grid.collectionView.sortComparer = function(itemA, itemB){
      // implement comparer here
  }
  

  API reference:
  
  sortComparer: https://www.grapecity.com/wijmo/api/classes/wijmo.collectionview.html#sortcomparer

  Regards
  
  Sharad

• 

  vinaybietpratap

  • Post Options:
  • Link
    Copy

  Posted 28 September 2020, 1:58 am EST

  Hi Sharad,

  Thanks for reply. The above sortComparer function works based on the value but in my case I want to sort the item based on the datatype. Below is the sample data that I am using -
  
  {
  
  “meta”: {
  
  “E1585574559807”: “DECIMAL”,
  
  “ENDLOCNAME”: “STRING”,
  
  “E1585574522757”: “DECIMAL”,
  
  “ASSETID”: “STRING”,
  
  “E1585574483408”: “NUMBER”,
  
  “E1585574542007”: “DECIMAL”,
  
  “ENDLOCID”: “STRING”
  
  },
  
  “data”: [
  
  {
  
  “E1585574559807”: “47.28”,
  
  “ENDLOCNAME”: “Germany”,
  
  “E1585574522757”: “47.28”,
  
  “ASSETID”: “1”,
  
  “E1585574483408”: “1”,
  
  “E1585574542007”: “47.28”,
  
  “ENDLOCID”: “3000036822”
  
  },
  
  {
  
  “E1585574559807”: “3.49”,
  
  “ENDLOCNAME”: “Spain”,
  
  “E1585574522757”: “3.49”,
  
  “ASSETID”: “2”,
  
  “E1585574483408”: “1”,
  
  “E1585574542007”: “3.49”,
  
  “ENDLOCID”: “3000082993”
  
  }
  
  ]
  
  }

  From the above sample as you can see in Data, everything is string, but Want to sort the column based on the datatype.

• 

  manish.gupta

  

  • Post Options:
  • Link
    Copy

  Posted 30 September 2020, 7:02 am EST

  Hi,
  
  For this, you may use the sortConverter() method which can be used to modify the compared value.
  
  In this case, we may convert the string to number in this method for sorting only while in the FlexGrid, it would remain as a string.
  
  Please refer to the attached sample for reference.

  Regards,
  
  Manish Gupta
  
  FlexGrid_customSort.zip