This is a migrated thread and some comments may be shown as answers.

Grid Editor Widget Issues

4 Answers 31 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Steve
Top achievements
Rank 1
Steve asked on 01 Nov 2019, 11:25 AM

Hi,

I need a grid (or maybe another similar tabular display) to show a column of text and a boolean column with a switch widget.

The switch widgets need to be always visible, unlike this example where you need to click the cell to go into edit mode.

I have followed another approach in order to achieve this, but for some reason I don't seem to able to get the grid data item in the switch change handler (rowDataItem is undefined, while grid and gridRow appear to resolve ok).

Assistance is appreciated.

Thanks.

 

4 Answers, 1 is accepted

Sort by
0
Accepted
Georgi
Telerik team
answered on 05 Nov 2019, 07:56 AM

Hello Steven,

Indeed one way to achieve the described behavior is to use a template and bind each row to its corresponding data item as in the second sample. Currently the dataItem is undefined as the grid is rebound when the item is changed. In other words, new tr elements are rendered. A possible workaround would be to get the dataItem using the uid attribute of the row.

e.g.

    function GridSelectionSwitchChanged()
    {
      var grid = $("#gridDiv").data("kendoGrid");
      var gridRow = this.wrapper.closest("tr");
      var rowDataItem = grid.dataSource.getByUid(gridRow.attr('data-uid'))
      console.log("Item: " + rowDataItem.Field1 + " change: IsSelected: " + rowDataItem.IsSelected);
    }

Below you will find a modified version of the provided sample:

 

Regards,
Georgi
Progress Telerik

Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
0
Steve
Top achievements
Rank 1
answered on 05 Nov 2019, 10:49 AM

Hi Georgi.

As I understood it, grid.dataItem() would use the uid attribute on its rendered row to retrieve the data item.

Though the uid's still appears to be present on the tr elements, I was assuming that the kendo.bind binding could be replacing the grid's own binding to the elements it rendered, and so, grid.dataItem() wouldn't be able to resolve anything.

From your description, it sounds like the tr found by the SwitchChanged handler is the old tr - and at that time (or just before) has been replaced by the re-rendering of the grid. The old tr might still exist as an object, but is removed from the DOM. It is no longer a child element of the grid (enough for .dataItem() to not resolve even though uid attribute is present?) - but the uid can still be used to retrieve the data item from the data source.

Your modification makes sense and appears to work well.

Thanks for the help.

Regards,

Steven

0
Georgi
Telerik team
answered on 07 Nov 2019, 09:08 AM

Hello Steven,

Your understanding is correct. 

However, the dataItem method internally uses the index of the row to map it to its corresponding model.

e.g.

 return this._data[correctIdx]; // where correctIdx is the index of the row in the table

However, as the row is no longer in the DOM, its index is -1, thus nothing is returned.

Regards,
Georgi
Progress Telerik

Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
0
Steve
Top achievements
Rank 1
answered on 07 Nov 2019, 10:32 AM

Hi Georgi,

Thanks for clarifying.

Tags
Grid
Asked by
Steve
Top achievements
Rank 1
Answers by
Georgi
Telerik team
Steve
Top achievements
Rank 1
Share this question
or