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

kendo grid locked columns restore selected rows after saveChanges() not working as expected

4 Answers 536 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Ian
Top achievements
Rank 1
Ian asked on 16 Feb 2016, 08:45 PM

I want to be able to restore the selected row in a grid after performing a saveChanges() call.
I was able to get this working when there are no locked columns by using the following definitions in my gridOptions object:

 

...
dataBound: function (e) {
    if (selectedUids.length != 0) {
        for (var i = 0; i < selectedUids.length; i++) {
            var curr_uid = selectedUids[i];
            //find and reselect the rows via their uid attribute
            this.tbody.find("tr[data-uid='" + curr_uid + "']").addClass("k-state-selected");
        }
    }
},
dataBinding: function (e) {
    selectedUids = [];
 
    $("#ddhintgrid .k-state-selected").each(function () {
        selectedUids.push($(this).data("uid"));
    });
                 
},
...

 

However, when trying this with locked columns I only get the row selection back in the unlocked section. See attached files for example.

When I try debugging I notice that with locked columns I get the same UID inserted into selectedUids twice.

The end goal here is that I want the entire row including the locked section to be re-selected after a grid.saveChanges() operation.

4 Answers, 1 is accepted

Sort by
0
Accepted
Boyan Dimitrov
Telerik team
answered on 18 Feb 2016, 03:42 PM

Hello Ian,

 

In order locked columns to behave as expected they are stored in separate table element. This is the reason why the class is applied to the table row from one of the tables. 

 

My suggestion is to find the other row element (on same row but from the second table) and apply the selected class to that element as well. 

 

Regards,
Boyan Dimitrov
Telerik
 
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
 
0
Ian
Top achievements
Rank 1
answered on 18 Feb 2016, 03:51 PM

Can you provide a simple example on how this would be done? I will then adapt it to my own implementation.

Thanks,

Ian

0
Ian
Top achievements
Rank 1
answered on 22 Feb 2016, 12:08 PM

In order to get the entire row selected it was necessary to modify my dataBound property like so:

 

dataBound: function (e) {
    if (selectedUids.length != 0) {
        for (var i = 0; i < selectedUids.length; i++) {
            var curr_uid = selectedUids[i];
            //find and reselect the rows via their uid attribute
            this.tbody.find("tr[data-uid='" + curr_uid + "']").addClass("k-state-selected");
 
            $(".k-grid-content-locked").find("tr[data-uid='" + curr_uid + "']").addClass("k-state-selected");
 
        }
    }
},

0
Boyan Dimitrov
Telerik team
answered on 22 Feb 2016, 12:29 PM

Hello Ian,

 

Please take a look at the following http://dojo.telerik.com/IFArI example. The button blow the grid will select the first row, but same approach can be used in order to select a row with specific uid value. 

 

Regards,
Boyan Dimitrov
Telerik
 
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
 
Tags
Grid
Asked by
Ian
Top achievements
Rank 1
Answers by
Boyan Dimitrov
Telerik team
Ian
Top achievements
Rank 1
Share this question
or