48
Views
8
Comments
Solved
[OutSystems Data Grid Web] Data Grid Web Pagination After Ajax Refreash
outsystems-data-grid-web
Web icon
Forge asset by OutSystems
Application Type
Traditional Web
Service Studio Version
11.53.23 (Build 61527)

I currently have a use case where a user is performing an action to do mass updates for the same cell in different rows a Data Grid. Once the user performs the action, I refresh the data grid with an ajax refresh in order to show the submitted data properly. However after the ajax refresh is complete, it starts the data grid back at page 1, instead of the page they were working on. I have used the following JS after the ajax refresh to try and paginate back to their page: 

var customGridPage = function(gridId, page) {        

     var gObj = GridOS.ComponentUtils.getGridObjectById(gridId);        

     gObj.view.moveToPage(page);       

}


Initially this did not work, but when I disabled the ajax refresh for the Data Grid, it worked with no problems. I have a feeling that the page can not paginate because the data is not done loading, so I found the onRefreshed and onLoadedRows methods and added them to the advanced format:

"onRefreshed: customGridPage('" + AllAssignmentDetailGrid.Id + "', " + 3 + ")"

However this causes the page to break and displays an error on the gObj.view.moveToPage(page); line.

Any suggestions on how to return the user back to the page they were working on before the refresh?     


2022-11-12 11-28-30
Gonçalo Martins
Staff
Solution

Hello @Austin Healy 

With the time I got to look at this, I found out that the problem is related to the timing where the moveToPage method is being called since the data was not loaded yet.
Probably, there's a Wijmo event that is triggered when all data was loaded but with the ones I explored I was not able to make it work properly.

The workaround I found and that worked will have a variable I don't like for these scenarios which is the time to run on a setTimeout.

  1. Started by defining my handler in the Javascript file at the screen level (I created a window object just to be easier to keep the page number):
  2. I ran the method in the Preparation to be bind to the Ajax request:
  3. And, for sample purposes, I'm updating the page number and doing an Ajax refresh:


Note: I created a new restAPI since there was still no data on your last oml and created a new screen with my workaround (not the best solution but if you fine-tune the timing it will at least unblock the use case until you find the right event to look at)

Hope it helps and if you find a better solution please share it with the community.

Cheers,
GM

ForumApplication_workaround1.oml
2022-11-12 11-28-30
Gonçalo Martins
Staff

Hello @Austin Healy

Could you share an oml with that use case so that I can try to help?

Cheers,
GM

2022-09-29 16-31-59
Austin Healy

Hello @Gonçalo Martins,

I could not attach the actual oml, because there is some sensitive information in there, so I copied it into my personal environment and took out the information I could not post.  Here is the .oml for that project. I tried to comment where I took out things on my flows. 

Thanks!

Austin

Edit: Removed OML for security reasons

2022-11-12 11-28-30
Gonçalo Martins
Staff

Hello @Austin Healy 

There's no data on the Grid so it's really hard to understand what you're trying to achieve.
Could you please provide steps to reproduce so that I can try to add some sample data in order to try to replicate it?

Cheers,
GM

2022-09-29 16-31-59
Austin Healy

My appologies,

I have attached a test application I put together that will include some test fields. It is a simple application used to demonstrate my issue.  If you were on page 3 of the data grid, but enter in text on the Test Field input box and click assign, the refresh brings you back to page 1 when I want the user to be able to stay on page 3. 

Hope this helps

Austin

ForumApplication.oml
2022-11-12 11-28-30
Gonçalo Martins
Staff
Solution

Hello @Austin Healy 

With the time I got to look at this, I found out that the problem is related to the timing where the moveToPage method is being called since the data was not loaded yet.
Probably, there's a Wijmo event that is triggered when all data was loaded but with the ones I explored I was not able to make it work properly.

The workaround I found and that worked will have a variable I don't like for these scenarios which is the time to run on a setTimeout.

  1. Started by defining my handler in the Javascript file at the screen level (I created a window object just to be easier to keep the page number):
  2. I ran the method in the Preparation to be bind to the Ajax request:
  3. And, for sample purposes, I'm updating the page number and doing an Ajax refresh:


Note: I created a new restAPI since there was still no data on your last oml and created a new screen with my workaround (not the best solution but if you fine-tune the timing it will at least unblock the use case until you find the right event to look at)

Hope it helps and if you find a better solution please share it with the community.

Cheers,
GM

ForumApplication_workaround1.oml
2022-09-29 16-31-59
Austin Healy

Hello @Gonçalo Martins,

I appreciate you looking into this. I thought about this solution in the past, however if for some reason our dataset grows and it takes longer to load the data it may exceed the timer that I implement. This would break our solution and cause this to become an issue again. I realize I could put the time waited on a site property, however that means that I would have to rely on the business to tell me when this process breaks, and then have to go back in and fine-tune the time again. This is a great workaround, however I do not believe this is a solution to my problem. 

Thanks for looking into it and providing your feedback. 

Best Regards,

Austin 

2022-11-12 11-28-30
Gonçalo Martins
Staff

Hello @Austin Healy 

Agree 100% and that's why I mentioned it was just a possible workaround.
If you find a solution using Wijmo's Flexgrid events, please share it since I believe it should be useful for someone else in the community.

Cheers,
GM 

2022-09-29 16-31-59
Austin Healy

If I do find a solution to this issue I will be happy to post it here.  I would like to note that I did log an idea in the Outsystems Idea board regarding adding a current/starting page for the data grids. This way it is just a property for the reusable references. Let me know if you think of anything yourself. 

Community GuidelinesBe kind and respectful, give credit to the original source of content, and search for duplicates before posting.