Hello,
We are using the UI igGrid where we are listing orders (see screen caption). The user can either click on the View or Edit button which opens up a new browser window/tab where the order can be modified and saved (including the order status). What we want to do is when the browser window that the order list is on gets the focus again we would like to reload the page so that the order record that was just modified is refreshed with the updated order status and selected so that the user remembers which order they just modified was (for example Order 48842 as the illustration shows). How can I get the grid to select the row again and have the page post when the browser window gets the focus again.
Thanks!
So I think I got it working, but I had to move some code around and it seems to be working. One more questions if the selected record is not on page 1 of the grid how to i set the grid's paging back to the page it was last on?Thanks again.
Hello Richard,
As I have suggested in my previous response, the previously selected row could be saved in the localStorage before the reload and set afterwards as follows:
$(function () {
window.addEventListener("load", function () {
let selectedRowId = localStorage.getItem("selectedRow")?.id;
$("#grid").igGridSelection("selectRowById", selectedRowId);
});
document.addEventListener("visibilitychange", function () {
if (!document.hidden) {
localStorage.setItem("selectedRow", $("#grid").igGridSelection("selectedRow"));
window.location.reload();
}
Another suggestion to save the id of the row would be to use sessionStorage or cookies.
Please let me know if you need any further information regarding this matter.
Regards, Monika Kirkova, Infragistics
Thank you for the quick reply.
It seems that we are in the ballpark but when the page reloads it does not flag/set the row that was selected before the reload, as selected again like I need it to.
If we can get that achieved, it looks like this will work.
I look forward to your reply.
After investigating this further, I have determined that your requirement could be achieved by binding a method to the visibilitychange event. In this method the previously selected row would be saved to the localStorage and the page would be reloaded.
Furthermore, on window load event the saved row in the localStorage would be selected. This could be achieved as follows:
$("#grid").igGridSelection("selectRowById", localStorage.getItem("selectedRowID"));
localStorage.setItem("selectedRowID", $("#grid").igGridSelection("selectedRow")?.id);
Please test it on your side and let me know if you need any further information regarding this matter.