Creating a Paged Query

Before you begin

We added two dummy buttons on our page, which we will use in order to go to the previous and next page of the results. We will also display information about the current page and total pages.

Add an action file

Right click products (1) and add a new action file (2). Note: You can add as many queries as you wish in a single action file. We're showing different queries in different action files in our tutorials, in order to explain it better to you.

Add action file name

Add a name for your action file. We name it AllProductsPaged.

Add database connection

Right click steps (1) and add a database connection (2).

Choose your database connection

We've already set up a database connection in our previous tutorials, so we just select it (2), by clicking the load connection button (1).

Add paged query

Right click the connection step (1) and select add database paged query (2) from the database actions menu.

Save your action file

Don't forget to save your action file.

Create server action executor

Select server action executor (1) in the HTML5 Data Bindings and click add new button (2).

Customize the executor

Add a name for your executor (1), select the run on DOM ready option (2) and choose your action file (3) from the dropdown. Click the OK button, when you are done.

Add repeat region

Expand the data element (1) under the server action executor, that we just created and select the repeating data element (2) of the query. Choose repeat region (3) from the dropdown and click insert (4).

Bind data inside the repeat region

We want to show our product names. So select the productName binding (1) and click insert (2).

Setup the paging controls

First, we will bind the page number info. Click on your page (1) where you'd like to show the current page number. In your query (2) expand the page group and select current (3). Click the insert button (4). We do the same with the total pages information, we just select the total binding instead.

Add behavior

Now, select the next button (1), open the behaviors panel (2), click the add new behavior button (3) and choose control DMXzone Server Connect Action Executor (4) .

Select the action

Set the action to run (1) and select your action executor (2) from the dropdown. Then, click the data override button (3).

Assign the value

Select offset (1) under the Input data tab. Expand the server action executor (2), under the available data bindings section, then expand your paged query (3). Under the page and offset elements (4), select next (5) and assign it as a value for the offset (6). Click OK, when you're done.

Apply the behavior

Click OK in order to apply the behavior. We do the same with the previous button, this time selecting the previous binding, as a value for the offset.

Save and preview

That's how easy it is to create a paged query, control the results with previous and next buttons and display information about the current and total pages.