updateRow on virtualized TreeGrid

[Nathan Collins]

Hi,

I'm trying to use update a row on a virtualized TreeGrid but when I do, the row data displayed in the TreeGrid doesn't change.

I pass the row data from the model to a component and edit it directly, but this has no effect.

I have then tried using updateRow to push the change back to the grid, but this also has no effect.

For example, I'm capturing the changed status of a checkbox in the row and effecting a change to the column field value. 

The row data object is updated correctly, but when I pass it to updateRow the column field value doesn't change.

I'm testing using a simple append to the field value, original value "ABCDE" becomes "ABCDE CHECKED". The value stays as "ABCDE" even after updateRow.

captureChange(event) {

                this.data.text = this.data.text + " CHECKED";

                this.$parent.$parent.$refs.grid.updateRow(this.data.index, this.data)

}

this.$parent.$parent.$refs.grid returns the correct TreeGrid element from the grandparent. The index is also correct, I have used filter to check the index and the data are the same from the grid. (e.g. this.$parent.$parent.$refs.grid.getCurrentViewRecords().filter((item) => item['value'] == this.data.value)[0])

I've even tried getting the record from the grid, modifying that and pushing it back with updateRow, with no effect, e.g.

captureChange(event) {

                let gridRow = this.$parent.$parent.$refs.grid.getCurrentViewRecords().filter((item) => item['value'] == this.data.value)[0];

                gridRow.text = gridRow.text + " CHECKED";

                this.$parent.$parent.$refs.grid.updateRow(gridRow.index, gridRow);

}

Is this a limitation of virtualization or is there something I'm missing?

Thanks in advance,

Nathan

[Nathan Collins]

I've found in my investigations that updateRow does appear to work, but the row is only refreshed when I expand the row hierarchy. Until then the changes aren't visible.

There appears to have been a refreshRow method in a previous version of Syncfusion TreeGrid but it no longer appears in the API docs and is not a method when I try to call it.

[Padmavathy Kamalanathan]

Hi Nathan, 

 

Thanks for contacting Syncfusion Forums. 

 

Query: updateRow on virtualized TreeGrid 

 

We have validated the reported issue at our end. But we are unable to reproduce the issue. We can update treegrid row using updateRow method when virtualization is enabled.  

 

Also we have tried updating row data when changing checkbox value. It also works at our end. We have created sample for your reference. Please check the below sample, 

https://codesandbox.io/s/sf-vue-treegrid-virtualization-forked-z2vp4?file=/src/App.vue 

 

We do not have any method like refreshRow for refreshing the Tree Grid rows. We suggest you to use updateRow method. 

 

Still facing the issue, kindly share us the below details, 

1. Share us your complete Tree Grid rendering code
2. Your Product version detail
3. Share us screenshot of error with complete stack trace(if any)
4. Share us video demonstrating the issue.
5. If possible share us issue reproducing sample or reproduce the issue in the sample shared above

 

Regards, 

Padmavathy Kamalanathan 

[Nathan Collins]

Hi Padmathy,

Thank you so much for the prompt reply. I have resolved the issue. I didn't realise that I had to have editing enabled to effect changes programmatically.

I've added the editSettings property and now the row updates immediately when I use updateRow. I have not added the toolbar as it's not required.

editSettings: {

        allowEditing: true,

        mode: "Row",

      },

Thank you so much for your help,

Nathan

[Padmavathy Kamalanathan]

Hi Nathan, 

 

We are glad to hear that your issue has been resolved. 

 

Kindly get back to us for further assistance. 

 

Regards, 

Padmavathy Kamalanathan