Add manual pagination to an interface

You need a local variable that stores the document id and then is used within UI_Preview. the local needs to be updated with document id on click of the pagination button. You can achieve it by indexing the variable that holds the list of documents. This, way whether user moves forward or backward you can set the appropriate value indexed from the variable storing all documents. 

Thanks for the explanation :) I got 1 more question: After clicking the button, I the document ID will be updated with the new document ID, which is the next one, but the ID are not increment in a row, but each case will have a set of random document ID. If If I sort the ID by order, how can I get the 2nd ID, then 3rd, 4th in the list every time I click the button? Can Index() do this function?

yes index() can help you with this. you can make a index variable that stores the index as 1,2,3,4 etc for each data row in the document cdt. So upon pagination click you can increment the index variable to index +1 and using that get the next document details and id. e.g.  index(local!documentsCDT, local!index,{})

Sorry I didn't get your guidance here :(

The list of document IDs was queried from a table, and is saved in local variable, below you can see that for the same case, there are different document ID:

For example, I am choosing the 1st one: id = 2943356, if I click button next, I want the local!selectedDocumentId to be updated with Id = 2948520. 

How can I do it by using index()?

I have mentioned the steps so that its more clear. Hope this clarifies.

First declare a variable say

local!arrayIndex:1,

then, within the saveInto of pagination button add the line as

a!save(local!arrayIndex,
    if(local!arrayIndex<length(local!dataSToreEntityVariable),
        local!arrayIndex+1,
        local!arrayIndex))

just below the above code add the below line of code, to set the next document Id to the variable used to preview document. Thus, index increment and indexing the next row from the main variable happens on click of pagination button. 

a!save(local!selectedDocumentId,
index(local!dataStoreEntityVariable.id, local!arrayIndex,{}))

Can you clarify why this requires Manual Pagination?  After reading your post a couple times I'm not even sure "pagination" is really quite what you're after.  To me it sounds more like you want a read-only grid listing a batch of queried documents-by-id, allowing the user to click a link to open one of them in a previewer, then adding "previous / next" links to the Previewer interface to allow the user to quickly browse among the existing list of doc IDs without having to click back up to the parent interface over and over again.  Am I far off?

If I am pretty close: This is all pretty straightforward to implement, and it would be a lot easier to give you advice if you could attach some sample code for what you have so far, screenshots, and a detailed breakdown of what you're having trouble doing so far.  As usual, when providing sample code (of any length, but especially for anything longer than just a couple lines), please use the Code Box functionality found under the "insert" menu ("Insert" --> "Insert Code").

IMHO this could all be built into a single interface pretty easily, though certain things could be simplified a bit by separating the "document preview with links" functionality into a child interface (that could be done afterwards though).

Thanks a lot for the detail explaination, I apply the same logic and it totally worked for me

Hi Mike, Harsha's above solution was absolutely what I need :D. And your assumption is correct by the way! Thanks for your time supporting :)

Btw, the pagination is an additional feature to existing interfaces, we already have the document list and doc preview interfaces, so there are less works need to be done than I thought :D 

Glad it helped!