Wijmo Grid Issue - copy/paste auto row generate issue

Wijmo Grid Issue - copy/paste auto row generate issue

Posted by: conkpal on 12 August 2024, 9:54 am EST

• 

  conkpal

  • Post Options:
  • Link
    Copy
  • Jump To Answer

  Posted 12 August 2024, 9:54 am EST - Updated 12 August 2024, 10:12 am EST

  Team,

  I’m facing an issue with the Wijmo Grid’s copy/paste functionality related to auto row generation. In my case, when I copy more than one row and then select the last row to paste, only the first row from the clipboard is pasted, while the remaining rows are not. This functionality was working correctly in version angular 15(“@grapecity/wijmo.angular2.all - 5.20211.794”, ), but it stopped working after the update to version angular 15(“@grapecity/wijmo.angular2.all - 5.20231.904”,).

• 

  vivek.pannu

  

  • Post Options:
  • Link
    Copy

  Posted 13 August 2024, 7:02 am EST

  Hi,

  This query has already been addressed on our other portal, here’s a copy of the response -

  We tried to replicate the issue as per your description, but we were not able to replicate it.

  Please find attached the sample we used to replicate the issue. Could you please update the attached sample to replicate the issue and share it with us?

  sample: https://stackblitz.com/edit/angular-4rxufh?file=package.json

  In case, if there is something we missed, please let us know.

  Thanks, and regards

• 

  conkpal

  • Post Options:
  • Link
    Copy

  Posted 19 August 2024, 10:45 pm EST

  Hi Team,

  I have validated your demo project, and it looks good to me. I’ve also prepared a demo project to give you visibility into the issue I’m encountering. You can reproduce the same problem there:

  https://stackblitz.com/~/github.com/karthiwaters/flex-demo

  Attached the screen record for real time behavior

• 

  vivek.pannu

  

  • Post Options:
  • Link
    Copy

  Posted 21 August 2024, 8:54 am EST

  Hi,

  This issue is already being addressed on our other portal, here’s a copy of the response -
  
  Thank you for sharing the sample. On investigating the sample, we found the ‘onRowEditStarted’ and ‘onRowEditEnded’ methods of the FlexGrid are overridden in the ‘app.component.ts’ file in the sample, due to which this issue arises. You’ll observe that removing code that overrides these methods would resolve the issue.
  
  These methods are internally used to trigger the required events and perform some other tasks internally. So, to avoid this issue, there is a need to update/remove these overrides. Could you please share some more information, about what exact functionality you are trying to achieve by overriding these methods? It would help us to understand your requirements better and provide you with a solution accordingly.

  Regards

• 

  conkpal

  • Post Options:
  • Link
    Copy

  Posted 22 August 2024, 2:38 am EST - Updated 22 August 2024, 3:07 am EST

  We use onRowEditStarted primarily to disable other controls on the page while the table is being edited.
  
  We use onRowEditEnded to perform validation once the editing is complete, so we can immediately indicate whether the new values in the row have caused errors in the table data.
  
  It’s also worth noting that we use onGridBeginningEdit to dynamically modify dataMap values for a cell based on the values in other cells in that row.

  Thanks

• 

  vivek.pannu

  

  • Post Options:
  • Link
    Copy

  Posted 23 August 2024, 4:42 am EST

  Hi,

  Overriding onRowEditEnded or onRowEditStarted is not recommended, as these functions are used internally and defined to perform tasks, overriding these functions would stop those internal tasks, which might interrupt the default functioning of the grid. Therefore, it is recommended to use event handlers as much as possible, you can use the ‘rowEditStarted’ and ‘rowEditEnded’ events of the Flexgrid in the current scenario.

  Also, please avoid canceling the event as it will cancel the addition of new rows.

  
     // Use rowEditStarted to reset editing properties
                  this.flex.rowEditStarted.addHandler((s,e) => {
                      //Skip saving if pasting
                      if (this.flex.pastingInProgress) {
                          return;
                      }
                      this.flex.onRowEditStartedWrapper(e, () => this.onRowEditStarted(e));
                  });
          
                  // Use rowEditEnded to perform row validation
                  this.flex.rowEditEnded.addHandler(async(s,e) => {
                      //Skip saving if pasting
                      if (this.flex.pastingInProgress) {
                          return;
                      }
                      await this.flex.onRowEditEndedWrapperAsync(e, async () => await this.onRowEditEnded(e));
                  });

  Please find attached an updated sample for the same. In case we missed something, or you need further assistance, do let us know.

  Thanks, and regards

  flex-demo-patch-97850.zip

• 

  conkpal

  • Post Options:
  • Link
    Copy

  Posted 9 September 2024, 6:26 am EST - Updated 10 September 2024, 3:48 am EST

  The copy and paste issue has been resolved, but it has caused other functionalities to break. For example, during grid initialization, we select the first row of the grid, and based on that, we perform business logic using the “selectedChanged” event. Now, the event is not being triggered.

  When we try to select index (1), it works as expected, and the selectedChanged event is triggered properly. However, we are encountering an issue when attempting to select index (0); the event is not being triggered. Please advise. Thanks advance.

• 

  vivek.pannu

  

  • Post Options:
  • Link
    Copy

  Posted 11 September 2024, 7:37 am EST

  Hi,

  The default selection in the grid is (0, 0), and the selection done by you is also (0, 0), which essentially didn’t change the selection, therefore the selectionChanged event didn’t got triggered.

  In case you need to fire the event, we can fire the event manually if we want.

      selectRow(): void {
          this.scrollIntoView(this.rowToSelect, this.colToSelect);
          const cellRange = new CellRange(this.rowToSelect, this.colToSelect);
          this.select(cellRange);
          const cellRangeEventArgs = new CellRangeEventArgs(this.cells, cellRange)
          this.selectionChanged.raise(this, cellRangeEventArgs)
      }

  Please look at the attached sample for better understanding.

  In case you need further assistance do let us know.

  Thanks, and regards

  flex-demograpecity-patch-97850.zip