How to highlight default one row in Flex Grid using Angular 2?

How to highlight default one row in Flex Grid using Angular 2?

Posted by: ramu on 17 November 2017, 1:12 am EST

• 

  ramu

  • Post Options:
  • Link
    Copy
  • Jump To Answer

  Posted 17 November 2017, 1:12 am EST

  Hi,

  I have used Wijmo 5.20171.282 version.

  I have done like at below,

  
  <wj-flex-grid [itemsSource]="myData" [headersVisibility]="'Column'" [isReadOnly]="true" [selectionMode]="'Row'">
  
  this.myData= new wjcCore.CollectionView();
   this.myData.moveCurrentToPosition(2);
  
  

  So its highlighted 3rd row in my grid. But once I clicked paging, first row automatically highlighted in 2nd paging then again clicked 1st paging same like first row highlighted not my 3rd row.

  I want to always highlighted my 3rd row in 1st paging. How to do this?

  Thanks,
  
  Ramu

• 

  manish.gupta

  

  • Post Options:
  • Link
    Copy

  Posted 19 November 2017, 9:13 pm EST

  Hi Ramu,
  
  As default, first item gets selected for each page. To select third row on page change as default, you need to handle pageChanged event of CollectionView and call moveCurrentToPosition method.
  
  http://demos.wijmo.com/5/Angular/WijmoHelp/WijmoHelp/topic/wijmo.collections.CollectionView.Class.html#pageChanged

  ~Manish

• 

  ramu

  • Post Options:
  • Link
    Copy

  Posted 19 November 2017, 10:38 pm EST

  Thanks Manish.

  Not always to highlight the third row for each page.

  In my collection having one record has default item. So I want to highlighted that row with different style, not default one highlight style.

  I need both style. How to do this?

  Thanks,
  
  Ramu

• 

  manish.gupta

  

  • Post Options:
  • Link
    Copy

  Posted 20 November 2017, 8:46 pm EST

  Hi Ramu,
  
  You can use itemFormatter to set default color for that item or you can add CSS class for that row.

  flex.rows[rowIndex].cssClass="highlight";
  

  ~Manish