Log in to AnswerLog in to Follow
UserImage.jpg
d cabral
21Views
8Comments
Solved
Pagination in React Web
Question
Reactive
Best Practices
Data
OutSystems UI
Development
Application Type
Reactive
Service Studio Version
11.14.14 (Build 59923)

Hi All,

I would like to know more about the Pagination the documentation provided is limited to DB. React - Pagination


My concern is initially the user inputs data and display to a table and its stored on a local structure.


Now while the user still not hitting the save button I would like to ask help how to make the pagination work.


E.g. Table will display 5 rows per page

Name of Local Variable MyUserList 

Structure - (List of Users) Data Type

The Attributes below

Users.Name

Users.Id

Users.Email


how do I refresh the table to display the 6th to 10th users using the pagination


0
0
21 Apr

Replying to d cabral's comment on 21 Apr 2022 06:25:24

Hi @d cabral,

Your table not refreshing on pagination because you have to use two different local list variables-

one to store whole record list and second one to store records that you want to display on table.

I have modified them oml you shared. PFB. 

Now its working fine as per your changes.

See solution in context
Demo_012.oml

1
0
21 Apr

For showing the next 5 records ( as you said from 6 to 10) you should use "Pagination" widget available in reactive web. Then bind this widget with your data source (MyUserList). 

Can refer example on below URL : https://success.outsystems.com/Documentation/11/Developing_an_Application/Design_UI/Patterns/Using_Mobile_and_Reactive_Patterns/Navigation/Pagination

If still face any difficulty to implement this, please let me know.

Regards

0
0
21 Apr

Does it mean that pagination will not work for local list of datas? any alternative pagination that can easily interact with a table that will not interact to the actual DB/table

0
0
21 Apr

Hi ,

Can you please briefly explain 

Now while the user still not hitting the save button I would like to ask help how to make the pagination work.

 for proper solution .

Thanks,

Jitendra


1
0
21 Apr

provided further explanation @ Narendra Bhangale  reply to my post.

0
0
21 Apr

Hello @d cabral,

As per your requirements I have created one demo application for your reference.

oml file is also attached PFB.

If my solution is not fit as per your requirements you can elaborate your problem statement so I will modify solution as per that.


Regards,

Narendra Bhangale.

Demo_012.oml

0
0
21 Apr

I have updated the oml file you shared.

the form will not communicate to the actual table because it is a child block of a big page. to make it simple it will have a local variable that holds the list. now the table will be modified by the user by adding or editing or deleting the record.

as you can see in the red circle the 2nd page was click but the actual table is not showing the next 11 to 14 items


you may see the .oml attach 


FYI the child web block (my concern) that contains the table will not interact to the DB as the parent page will only give it the structure list. 

Demo_012.oml

0
0
21 Apr

Replying to d cabral's comment on 21 Apr 2022 06:25:24

Hi @d cabral,

Your table not refreshing on pagination because you have to use two different local list variables-

one to store whole record list and second one to store records that you want to display on table.

I have modified them oml you shared. PFB. 

Now its working fine as per your changes.

Demo_012.oml

1
0
21 Apr

Replying to Narendra Bhangale's comment on 21 Apr 2022 07:30:52

This is what I want to output for, therefore I need to transfer the list of data to another local variable for displaying purposes.

Thank you very much guys

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