Hello Mike,

Every row that is currently expanded has an area-expanded attribute that is set to true. In order to get all expanded rows at a certain point of time you can use a jQuery selector for all the rows that has this attribute value set to true. For example:

var expandedRows = $("#hierarchicalGrid tr[aria-expanded=true]");

expandRows will be a collection with all currently expanded row DOM elements.

Afterwards, when you want to expand them again you can use expand method of the igHierarachicalGrid. It takes row DOM element as an argument and it could be retrieved from expandRows collection. For example:

 $("#btnExpandRows").click(function(){
    if(expandedRows){
    $.each(expandedRows, function(){
         $("#hierarchicalGrid").igHierarchicalGrid("expand", this);
    });
    }
    })

I am attaching a small sample illustrating my suggestion for your reference. First expand a row/rows and click "Get Expanded Rows button". Then collapse them and click the "Expand Previously Expanded Rows Button". All previously collapsed rows will be expanded again.

Please let me know if you need any further assistance with this matter.

Hello Vasya Kacheshmarova  I tired your code but after refresh the grid ... row is getting collapse

function SetExpandedRows(gridName, expandedRowIds) {
debugger;
//Loop through the array of row id's
for (var i = 0; i < expandedRowIds.length; i++) {
//Get the reference to the row in the grid
//var gridRow = $("#" + gridName).igGrid("rowById", expandedRowIds[i]);

expandedRowIds.push($(this).attr("data-id"))
localStorage.setItem("id", JSON.stringify(expandedRowIds));
console.log(localStorage);
if (localStorage) {
debugger;
$.each(JSON.parse(localStorage.getItem("id")), function () {
var newEl = $("tr[data-id='" + this + "']");
debugger;
$("#" + gridName).igHierarchicalGrid("expand", newEl);
});

}

Since you would like to implement persistence across data binding and browser refresh my suggestion is to use row ids (as you assumed) and keep these ids in the localStorage. Afterwards, when you would like to expand these rows again to retrieve the row by its id and pass it as parameter to expand method.For example:

$("#btnGetExpandedRows").click(function(){
    expandedRows = $("#hierarchicalGrid tr[aria-expanded=true]");
    $.each(expandedRows, function(){
    dataIds.push($(this).attr("data-id"))
    });
    localStorage.setItem("id",JSON.stringify(dataIds) );
    })
     $("#btnExpandRows").click(function(){
    if(localStorage){
    $.each(JSON.parse(localStorage.getItem("id")), function(){
     var newEl = $("tr[data-id='" + this + "']");
     $("#hierarchicalGrid").igHierarchicalGrid("expand", newEl);
    });
    }
    else{
     alert("Expand any row");
    }
    });

 I am attaching ,y modified sample for your reference.

Please let me know if you have any additional questions regarding this matter.