setCellData for calculated columns Causes issues in editing another cell

setCellData for calculated columns Causes issues in editing another cell

Posted by: unnati.k26 on 18 May 2021, 8:17 pm EST

• 

  unnati.k26

  • Post Options:
  • Link
    Copy
  • Jump To Answer

  Posted 18 May 2021, 8:17 pm EST

  I am using the below script to update the “Column3” data based on “Column1” and “Column2”. If I do not use the “setCellData” then the “Column3” data doesn’t get its grand total in the bottom row and also the export will not have any data populated for it.

  So to resolve the issue I used “setCellData” and the two issues are fixed. But now I am not able to edit “Column1” or “Column2” properly as these columns are getting flickered. You can check the behavior at
  
  https://unnati-khanorkar.outsystemscloud.com/DataGridIssue/Entry1.aspx

  Adding the code snippet used -
  
  //Add Grand total row at the end
  
  var addSumRow = function(gridId){
  
  var gObj = GridOS.ComponentUtils.getGridObjectById(gridId);
  
  var grid = gObj.grid;
  
  grid.columnFooters.rows.push(new wijmo.grid.GroupRow());
  
  grid.bottomLeftCells.setCellData(0, 0, ‘Total’);
  
  };

  // custom cell calculation
  var calculateGridColumn = function(gridId){
  var gObj = GridOS.ComponentUtils.getGridObjectById(gridId);
  var grid = gObj.grid;
  grid.formatItem.removeAllHandlers();
  

  // wijmo.grid.xlsx.FlexGridXlsxConverter.save(grid,{formatItem:exportFormatItem},“Grid.xlsx”);
  
  grid.formatItem.addHandler(function (s, e) {
  
  //
  
  // cells and column footer panels only
  
  if (e.panel == s.cells) {
  
  //
  
  // get row, column, and data item (or group description)
  
  var r = s.rows[e.row];
  
  var c = s.columns[e.col];
  
  var item = s.rows[e.row].dataItem;
  
  var group = r instanceof wijmo.grid.GroupRow ? item : null;
  
  // assume value is not negative
  
  var negative = false;
  
  //
  
  // calculate
  
  if (c.binding == ‘Column3’) {
  
  var column3Data = group ? group.getAggregate(‘Sum’, ‘Column1’) + group.getAggregate(‘Sum’, ‘Column2’)
  
  : item.Column1 + item.Column2;
  
  var column3Data = isNaN(column3Data)?0:column3Data;
  
  e.cell.textContent = wijmo.Globalize.format(column3Data, c.format);
  
  e.cell.innerHTML = wijmo.Globalize.format(column3Data, c.format);

             e.panel.setCellData(e.row,e.col,wijmo.Globalize.format(column3Data, c.format));
            // s.invalidate();
            // 
              negative = column3Data < 0;
          }  
          
          
          //
          // update 'negative' class on cell
          wijmo.toggleClass(e.cell, 'negative', negative);
      }
    
  });
  

  grid.invalidate();
  
  };

  Please let me know how can I fix the issue as I am not able to edit the column1 and column 2 data.

• 

  ashwin.saxena

  

  • Post Options:
  • Link
    Copy

  Posted 19 May 2021, 10:10 pm EST

  Hi Unnati,

  The issue occurs because the grid gets invalidated every time the setCellData() method is called, to resolve you need to pass the false parameter in the setCellData() at invalidate and also set the innerHTML of the current cell to the text so that it is displayed also without having to refresh the grid. Please refer to the API:https://www.grapecity.com/wijmo/api/classes/wijmo_grid.flexgrid.html#setcelldata

  e.panel.setCellData(e.row, e.col, wijmo.Globalize.format(column3Data, c.format),true,false);
  e.cell.innerHTML = wijmo.Globalize.format(column3Data, c.format);
  

  As a suggestion, I would recommend you use calcultedFields property of collectionView to do the calculation, which will be a lot easier. For using calcultedFields please make sure you have wijmo build 5.20203.748 and above.

  Demo: https://www.grapecity.com/wijmo/demos/Core/CollectionView/CalculatedFields/purejs

  Regards.

• 

  unnati.k26

  • Post Options:
  • Link
    Copy

  Posted 23 May 2021, 3:22 pm EST

  Thanks a lot Ashwin. It worked!