How to Set Up Paging in MVC

[CathyC]

Setting up paging in an MVC view:

On the View Canvas
On the view canvas, add a button at the bottom, with the text "Load More".
The button needs to call the controller that filters and pages

image.png (1.68 KiB) Viewed 3245 times

image.png (1.68 KiB) Viewed 3245 times

in the IsEOF property of the button, it needs to be tied to the EOF output of the Submethod/Callmethod

image.png (9.45 KiB) Viewed 2934 times

image.png (9.45 KiB) Viewed 2934 times

In the Button's Event (On the View Canvas)
Because some buttons will need to page, and others probably won't (filter buttons), you will need a way to call the Submethod/Callmethod without paging. You can do this by having separate controllers for each action OR by using one controller, but having flags for each action - we will use this second approach.

In the event on the "Load More" (paging) button, you will pass the paging event as a constant, "True":

This will be sent as the _ControllerParameters to the controller.
You can see in the screenshot that there are other parameters for the controller. Those are used for the filter button. However, when clicking the paging button, if there are filters applied, we wouldnt want them to be lost. To avoid that scenario, in the paging button, if there are any filter values from the page passed to the controller, they should be passed in the paging button too.



In the Controller
Define the controller parameters like so:
_ControllerParameters
_Page
Event

image.png (8.66 KiB) Viewed 2931 times

image.png (8.66 KiB) Viewed 2931 times

This allows us to know if the user is doing an action where we should retrieve the next page OR some other action which should reset/ignore the paging (the filter button would reset the paging, a download results button would ignore all paging - but the set up of those is not discussed here).

Add the Submethod/CallMethod in the canvas.
In the inputs, map them like this, pulling from the submethod/callmethod output in the model:
Event: Event (from _ControllerParameters)
FromRecord: NextStart (from model)
NoOfRecords: 100 (from the Model, if you put it in an Inputs CreateServiceNode [recommended], then pulled from there)

in the Submethod/Callmethod, define the output, just as you did when it was called from the Model. The only difference is that the "AppendExistingOutput" parameter should be set to this:

<xsl:choose>
<xsl:when test="WorkData/_ControllerParameters/_Page/Event='True'">True</xsl:when>
<xsl:otherwise>False</xsl:otherwise>
</xsl:choose>

This will make it so that when you click the "Load More" button, it retains the previous results AND adds the new results from the next page. BUT when you click any other non-paging button (like a filter button), it will clear the previous results and only return the latest results.

After the call to the Submethod/CallMethod, add an "UpdateElement". Newly created controllers will automatically have an UpdateElement service added to the canvas, but in case you need to add your own, they are in the MVCWorkshop

The UpdateElement service should target:

• The htmlid of the table which stores the results
• The htmlid of the paging button (needed for if this page has filtering too)

In the Submethod/CallMethod
This could be either a submethod or a callmethod, either is fine

Set up the parameters inside like so:
_Page
Event
FromRecord
NoOfRecords

image.png (4 KiB) Viewed 3245 times

image.png (4 KiB) Viewed 3245 times

When the Submethod/Callmethod is ran from runtime, it will look like this in the logs:

Add a CreateServiceNode to hold all the paging parameters. If your query also is doing filtering and has the download results feature, this CreateServiceNode can hold those inputs too OR you could create separate CreateServiceNodes for each feature.
Set up the CreateServiceNode like so:
Result #1:
FromRecord
<xsl:choose>
<xsl:when test="WorkData/_Parameters/_Page/Event='True'">
<xsl:value-of select="WorkData/_Parameters/_Page/FromRecord"/>
</xsl:when>
<xsl:otherwise></xsl:otherwise>
</xsl:choose>
Result #2:
NoOfRecords
<xsl:value-of select="WorkData/_Parameters/_Page/NoOfRecords"/>
Result #3:
Event
<xsl:value-of select="WorkData/_Parameters/_Page/Event"/>

In the query (Inquire/Runquery), set up the paging inputs like so:
Paging: True
RowCount: NoOfRecords (From the CreateSerivceNode, determined from logic based on the Event from the passed in _Parameters)
StartIndex: FromRecord (From the CreateServiceNode, from the passed in _Parameters)

When the query is ran from runtime, it will look like this in the logs:

In the Model
Add the Submethod/CallMethod in the canvas.
In the _Page inputs, map them like this:
Event: False
FromRecord: 0
NoOfRecords: 100 (this can be any value, but it is best to set up in some Inputs CreateServiceNode so everywhere can reference it)

In the Submethod/CallMethod, define the output that is expected from it. You will need to do the same in the controller, so remember what you put here