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

5 posts, 1 answers
  1. Ian
    Ian avatar
    12 posts
    Member since:
    Feb 2016

    Posted 16 Feb 2016 Link to this post

    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.

  2. Answer
    Boyan Dimitrov
    Admin
    Boyan Dimitrov avatar
    2062 posts

    Posted 18 Feb 2016 Link to this post

    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!
     
  3. Ian
    Ian avatar
    12 posts
    Member since:
    Feb 2016

    Posted 18 Feb 2016 in reply to Boyan Dimitrov Link to this post

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

    Thanks,

    Ian

  4. Ian
    Ian avatar
    12 posts
    Member since:
    Feb 2016

    Posted 22 Feb 2016 Link to this post

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

  5. Boyan Dimitrov
    Admin
    Boyan Dimitrov avatar
    2062 posts

    Posted 22 Feb 2016 Link to this post

    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!
     
Back to Top