Fix for issue where only visible area updates when pasting with virtual scrolling enabled

[cst9221]

Version

4.21.22

Development Environment

Browser: Chrome

OS: macOS

Current Behavior

When using virtual scrolling, data updates only within the visible area when pasting.

Expected Behavior

While looking for a fix, I found a workaround.
By stopping the paste operation in the beforeChange event, creating a copy of the existing data, applying the pasted values manually, and then updating with resetData, the issue can be avoided.

I saw several similar questions in the issues, so I’m sharing this workaround in case it helps others facing the same problem. I hope this information is helpful to others experiencing the same problem.

instance.on('beforeChange', (e) => {
  if (e.origin === 'paste') {
    // Stop the default paste event
    e.stop();

    const { instance, changes } = e;
    let data = [...instance.getData()];

    // Apply pasted values to the copied data
    changes.forEach((change) => {
      data[change.rowKey][change.columnName] = change.nextValue;
    });

    // Update the table with resetData
    instance.resetData(data);

    return;
  }
});

[HIMZ5221]

Just a small note about this approach — it does work, but resetData() has a few important side effects:

All modified flags are cleared, so the grid no longer knows which rows were edited.

afterChange does not fire, since changes are not applied through the normal editing pipeline.

finishEditing is not triggered, because the grid treats the update as a full data reload.

Just wanted to highlight these points so others are aware of the trade-offs when using this workaround.

#2108