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

[Ian]

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.

[Boyan Dimitrov]

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

 

 

[Ian]

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

Thanks,

Ian

[Ian]

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");

        }
    }
},

[Boyan Dimitrov]

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