Could I get some code examples of how to keep what rows are expanded and collapse in an UltraWebGrid after a postback? My grid is grouped by a column and is initially collapsed on load, buth then the users expand. After updating a record using a rowedittemplate, the grid is reloaded, but loses what rows are expanded and collapsed. I'd like to reload the grid then put it back the way it was before the postback.
Hello Will Larkin ,
I tried to reproduce your issue but was unable to. By default the grid will maintain its state if the EnableViewState is set to true.
Please refer to the attached sample and let me know if you notice any major differences. It would be also very helpful if you could modify this sample so that it reproduces your issue or alternatively provide me the code-snippets with the relevant code (mark-up for the grid) so that I can try and replicate the issue.
Thank you for your cooperation.
Best Regards,
Maya Kirova
Developer Support Engineer
Infragistics, Inc.
http://ko.infragistics.com/support
Thanks Maya! I believe my issue is because I'm databinding again on row update on the server side and that's refreshing the grid. If I comment out the databind in the UpdateRow event then the grid state persists, but I have to rebind because after a row is completely updated it needs to be removed from the grid. I'm going to look into maybe trying to remove the row on the client side, so I don't have to rebind and the row won't show up. I attached my files of the screenshot in my first post in case you have any ideas.
Hello Will Larkin,
The ExpandedRows collection contains an array with the ids of the rows you’ve expanded. You can get a reference to the row in the following manner once you get its id:
var row=igtbl_getRowById(rowId);
Once you get the row element you can get its child elements with:
row.getChildRows();
If the child row are not yet loaded to the grid I'd advise you to expand then on the server side ( this.UltraWebGrid1.Rows[0].Expand(false); ) as i previously suggested in one of my previous posts.
Let me know if you need further assistance with this.
I'm still trying to get this to work. Your suggestion of the ChildRows works great, as long as the row still exists after the databind. If the row that was expanded gets removed after the server side databind, it expands the next row below, as that row now has the saved RowID. I'm trying to now expand based on data in the groupby row instead of the RowID to solve this issue.
I'm having to iterate through the 1st level groups, then iterate through the 2nd level groupby rows, and compare each 2nd level groupby row to each value in the saved expanded list until a match is found. It's really slowing down the app, so I'm probably going to have to scrap it.
I'm just following up to see whether you need further assistance with this issue.
If so please let me know.
Maya, I ended up going about it a pretty harsh way to keep from rewriting everything I had to move it to the server side. It would have worked better, but the users have different ways to update a record. Biggest hurdle I had to get through was when enough rows are updated a group was completely removed from the grid. I had to get away from using the rowId because of this. I'm awaiting the users approval as this way adds seconds to the grid rerendering and slows the app down.
I call getExpandedRows on RowEditTemplate close event and setExpandedRows on InitializeLayoutHandler event of the grid.
function getExpandedRows() { var grid = igtbl_getGridById('uwg_pending'); var expRows = grid.ExpandedRows; var hidden = document.getElementById("hiddenField1"); hidden.value = ""; for (var i in expRows) { var row = igtbl_getRowById(i); var datak = (row.DataKey == "" ? datak = "X" : datak = row.DataKey); hidden.value += i + "|" + row.Value + "~" + datak + ","; } }
function setExpandedRows() { var grid = igtbl_getGridById('uwg_pending'); var hidden = document.getElementById("hiddenField1"); if (hidden.value != "") { var rowsToExpand = hidden.value.split(","); var oRows = grid.Rows; var numRows = 0; for (var i = 0; i < oRows.length; i++) { var lenExpandRows = rowsToExpand.length; if (numRows == lenExpandRows - 2) { return } oRow = oRows.getRow(i); oRow.setExpanded(true); if (oRow.ChildRowsCount > 0) { var oChildRows = oRow.Rows; if (lenExpandRows != 1) { for (var k = 0; k < lenExpandRows - 1; k++) { var rowDetail = rowsToExpand[k].split("|"); var rowData = rowDetail[1].split("~"); if (rowData[1] != "X" && rowData[1] == oRow.Value) { for (var j = 0; j < oChildRows.length; j++) { oChildRow = oChildRows.getRow(j); if (oChildRow != null) { if (oChildRow.Value == rowData[0] && oChildRow.DataKey == rowData[1]) { oChildRow.setExpanded(true); numRows++; break; } } } } } } } var expand = 0; for (var j = 0; j < oChildRows.length; j++) { oChildRow = oChildRows.getRow(j); if (oChildRow != null) { if (oChildRow._Changes.ExpandedRows != null) { expand++; } } } if (expand == 0) { oRow.setExpanded(false); } } } hidden.value = ""; }
Thank you for sharing your solution.
Let me know if I can further assist you with this issue.