Getting collectionView Undefined in wijmo grid

Getting collectionView Undefined in wijmo grid

Posted by: technical.store.technical on 21 June 2021, 7:26 am EST

• 

  technical.store.technical

  • Post Options:
  • Link
    Copy

  Posted 21 June 2021, 7:26 am EST - Updated 3 October 2022, 1:35 pm EST

  Hi Team,

  We are trying to fetch grid.collectionView which we are getting as undefined,
  
  ts file code -

  
  initGrid(grid) {
      this.grid = grid;
      const view = grid.collectionView;
      view.sourceCollection.forEach(c => (c._lastUpdated = new Date().valueOf()));}}
  

  html file code -

  
  
  <wj-flex-grid #flex  
            [itemsSource]="data"  
            (initialized)="initGrid(flex)" >
  
  

  Packages -
  
  “@grapecity/wijmo”: “5.20211.781”,
  
  “@grapecity/wijmo.angular2.grid”: “5.20211.781”,
  
  “@grapecity/wijmo.angular2.grid.filter”: “5.20211.781”,
  
  “@grapecity/wijmo.angular2.input”: “5.20211.781”,
  
  “@grapecity/wijmo.grid”: “5.20211.781”,
  
  “@grapecity/wijmo.grid.filter”: “^5.20211.781”,
  
  “@grapecity/wijmo.grid.selector”: “5.20211.781”,
  
  “@grapecity/wijmo.grid.xlsx”: “^5.20211.781”,
  
  “@grapecity/wijmo.input”: “5.20211.781”,
  
  “@grapecity/wijmo.interop.grid”: “5.20211.781”,
  
  “@grapecity/wijmo.styles”: “5.20211.781”,

  Please check the below image : -
  
  

  

  860×304 23.5 KB

  Please provide a solution.

  Thank You.

• 

  technical.store.technical

  • Post Options:
  • Link
    Copy

  Posted 22 June 2021, 1:38 am EST

  Hi Team,

  Can you please look into this issue.

  Thank you

• 

  technical.store.technical

  • Post Options:
  • Link
    Copy

  Posted 23 June 2021, 4:51 am EST

  Hi Team,

  Can you please look into this issue.

  Thank you

• 

  sharad.tomer

  

  • Post Options:
  • Link
    Copy

  Posted 23 June 2021, 6:37 am EST

  Hi,

  From the code snippet it seems like your data is featched from the server and it is not available at the time of the grid is created which is why collectionView is undefined during the grid initialization. To fix the issue what you could do is create the emoty collectionView and assign it to the grid and then assign the data to the collectionView’s sourceCollection after fetchig it from the server. You may refer to the following code snippet:

  // HTML
  <wj-flex-grid #flex  
            [itemsSource]="dataCv"  
            (initialized)="initGrid(flex)" >
  
  // TS
  import * as wjCore from "@grapecity/wijmo";
  
  constructor(){
      this.dataCv = new wjCore.CollectionView([]);
      // fetch data from server
     this.fetchDataFromServer();
  }
  
  
  fetchDataFromServer(){
      fetch(url)
         .then(res => res.json())
         .then(data => this.dataCv.sourceCollection = data);
  }
  
  initGrid(grid) {
      this.grid = grid;
      const view = grid.collectionView;
      view.sourceCollection.forEach(c => (c._lastUpdated = new Date().valueOf()));}}
  
  

  If the issue persists, please share a small sample demonstrating the issue.

  ~sharad