Pagination Features (Esp. for PC or Tablet Mode)
Pagination
When learning jQuery, various plug-in program attracted me. One of the useful plug-in program for data viewing is “Pagination”.
Today, I spare some free time and wish to share how to utilize PowerApps simple formulas to create the same function.
Formulas used in creating pagination cover only:
- If
- UpdateContext
- RoundUp & RoundDown
- CountRows
- LastN & FirstN
Screen OnVisible (Loaded) & First Page
Step 1
Screen:
Screen1.OnVisible:
UpdateContext({iter: 0});
UpdateContext({iter: RoundDown(Gallery1.Height/Gallery1.TemplateHeight,0)}); FirstN(Table1, iter)
When screen is loaded, it will display Gallery with Number of Rows as determined by “RoundDown(Gallery1.Height/Gallery1.TemplateHeight,0)” using FirstN(Tale1, iter)
Data
- Add datasource to your PowerApps (I have attached complete sample PowerApps but using Static Data, so that no connection is necessary to faciliate apps learning)
- Add a Gallery, with items connected to datasource
Gallery1.Items = LastN(FirstN(Table1, iter), RoundDown(Gallery1.Height/Gallery1.TemplateHeight,0))
Note:
Gallery1.Height/Gallery1.TemplateHeight is used to calculate “Viewable Number of Rows”.
This is a dynamic formula because when you manually adjust the Gallery1 Height using mouse, the formula will calculate automatically.
The same is also used for “Calculating No. of Page”.
Step 2
Showing Page No. / Total No. Page
Page No.:
RoundUp(iter/RoundDown(Gallery1.Height/Gallery1.TemplateHeight,0),0)
Total No. of Page:
RoundUp(CountRows(Table1)/RoundDown(Gallery1.Height/Gallery1.TemplateHeight,0),0)
Step 3
Cick on First Page or Last Page are common functions.
First Page: (Use FirstN)
UpdateContext({iter: RoundDown(Gallery1.Height/Gallery1.TemplateHeight,0)}); FirstN(Table1, iter)
Last Page: (Use LastN)
UpdateContext({iter: CountRows(Table1)}); LastN(Table1, iter)
Last Page
Step 4
Users may opt to search by "Record" or "Page". This is a quick search method.
Search (Page):
If(Value(SearchInput.Text) <= RoundUp(CountRows(Table1)/RoundDown(Gallery1.Height/Gallery1.TemplateHeight,0),0), UpdateContext({iter: Value(SearchInput.Text)*RoundDown(Gallery1.Height/Gallery1.TemplateHeight,0)}))
If formula allows only searching within “Total Pages”
Search (Records):
If(Value(SearchInput.Text) <= CountRows(Table1), UpdateContext({iter: Value(SearchInput.Text)-1+RoundDown(Gallery1.Height/Gallery1.TemplateHeight,0)}))
If formula allows only searching within “Total Records”
Search "Page" function
Search "Record" function
Step 5
Next Page:
If(iter < CountRows(Table1), UpdateContext({iter:If(iter < CountRows(Table1), iter+RoundDown(Gallery1.Height/Gallery1.TemplateHeight,0))}))
If formula will detect if the record has “Come to the End of Records” based on iter < CountRows(Table1)
Previous Page:
If(iter < 2*RoundDown(Gallery1.Height/Gallery1.TemplateHeight,0), UpdateContext({iter: RoundDown(Gallery1.Height/Gallery1.TemplateHeight,0)}); FirstN(Table1, iter), UpdateContext({iter:iter-RoundDown(Gallery1.Height/Gallery1.TemplateHeight,0)}))
If formula will detect if the record has “Come to the First Record” based on iter < 2*RoundDown(Gallery1.Height/Gallery1.TemplateHeight,0)
Last Wish...
Hopefully PowerApps Grougp can consider Plug-In for future version so that we Apps Creation (Making) [Not Programming] will be much more faster for Productivity Apps.
Welcome comments and improvement for betterment of all.
Enjoy reading and benchmarking my sample...a complete sample!
Comments
-
Pagination Features (Esp. for PC or Tablet Mode)
This is a solution that I'd like to incorporate into my app but I am not able to import the zip file without getting an error. Has anyone else had this issue?
-
Pagination Features (Esp. for PC or Tablet Mode)
Search Record is not properly working will you please check it once and it will be more helpful if we search for any perticular record
-
Pagination Features (Esp. for PC or Tablet Mode)
This is brilliant, but as someone noted above, it shows a full last page even if that means duplicating records from the second to last page. To fix this, replace the Gallery Items formula with:
Gallery1.Items = LastN(FirstN(Table1, iter), RoundDown(Gallery1.Height/Gallery1.TemplateHeight,0)-If(iter>CountRows(Table1),iter-CountRows(Table1),0))
Basically what this does is, if the iterator is greater than the total number of records, it reduces the last page by that amount rather than showing the number that can fit on the page even if some have already been shown.
-
-
Pagination Features (Esp. for PC or Tablet Mode)
I'm planning to add pagination to one of my apps and this post will definitely save me a lot of time implementing it, thanks for sharing! 🙂
-
Pagination Features (Esp. for PC or Tablet Mode)
Thanks Audrie and glad that some minor input or idea will help...
-
Pagination Features (Esp. for PC or Tablet Mode)
We are most definitely working on enhancements related to performance! Thank you for your ideas and for contributing to the community!-Audrie
*This post is locked for comments