Data Grid does not update when data change

I need to select multiple rows from an existing data grid to run a batch operation on them.
I do it as following:

  • create empty list to store future selections
  • assign to RowDoubleClick event .push(${event}) method to populate the list by selected rows
  • place a data grid to visualize selected rows and be able to remove them from the list too

2 problems:

  • custom data grid does not generate columns for that custom list until I declare at least one JSON inside. This is frustrating because I don't want to see any irrelevant data
  • custom data grid doesn't show selected data, it doesn't update itself, but if I visualize the list in a data list component, I see all the changes

What should I do to update the grid along with new selections?

The PrimeNG DataGrid component that Radzen uses under the hood need the whole array to change. For example data.push(item) will not make the DataGrid display the new item. However data = [, item] will display the appended item because data has changed. You can try doing Set property Name: selectedList, Value: [...${selectedList}, ${event}]

It works, thanks. But now I need the same for deletion and this code doesn't work:

const index = this.SelectedFamRevs.indexOf(${event}, 0);
if (index > -1) {
this.SelectedFamRevs.splice(index, 1);
const SelectedFamRevs=this.SelectedFamRevs

But data list shows that elements are deleted from the list...

This is the exact same thing. Instead of splice use Array.filter - you need a new array instance. This forum thread has a solution.

Thx. Now it works.
It's kind of expensive method to deal with the whole array when you modify only one member...