How pagination works in GraphQL?
Article 2973068, Status: VALIDATED
Table of Contents
❓Issue/Question
- How can I see the next page in Central Data?
💻Environment/Context
- Central Data
👌Resolution/Answer
- To move between pages in GQL, you need to use Cursor data
- In your query you need to include the following data points
-
hasNextPage- tells you if there is more data available -
endCursor- provides the Cursor you need to use in theafterflag to get the next page
-
- Example
First query
after: Null - because we want to get the first 10 results
query AllSeries {
allSeries(filter:
{titleId: "3"},
after: null)
{
pageInfo {
endCursor
hasNextPage
}
edges {
node {
id
startTimeScheduled
}
}
}
}First result
The first10 results
endCursor: "PjMLC1oLC0ZHQEBCCwtaCws="
hasNextPage: True
{
"data": {
"allSeries": {
"pageInfo": {
"endCursor": "PjMLC1oLC0ZHQEBCCwtaCws=",
"hasNextPage": true
},
"edges": [
{
"node": {
"id": "3",
"startTimeScheduled": "2024-12-13T10:59:34Z"
}
},
{
"node": {
"id": "9108",
"startTimeScheduled": "2020-01-15T09:00:00Z"
}
},
{
"node": {
"id": "9109",
"startTimeScheduled": "2020-01-15T11:00:00Z"
}
},
{
"node": {
"id": "9236",
"startTimeScheduled": "2020-01-19T09:00:00Z"
}
},
{
"node": {
"id": "10767",
"startTimeScheduled": "2020-01-24T17:00:00Z"
}
},
{
"node": {
"id": "10770",
"startTimeScheduled": "2020-01-24T18:00:00Z"
}
},
{
"node": {
"id": "10771",
"startTimeScheduled": "2020-01-24T19:00:00Z"
}
},
{
"node": {
"id": "10772",
"startTimeScheduled": "2020-01-24T21:00:00Z"
}
},
{
"node": {
"id": "10773",
"startTimeScheduled": "2020-01-25T16:00:00Z"
}
},
{
"node": {
"id": "10775",
"startTimeScheduled": "2020-01-25T19:00:00Z"
}
}
]
}
}
}
Second query
after: PjMLC1oLC0ZHQEBCCwtaCws= - because we want the results after that Cursor
query AllSeries {
allSeries(filter:
{titleId: "3"},
after: "PjMLC1oLC0ZHQEBCCwtaCws=")
{
pageInfo {
endCursor
hasNextPage
}
edges {
node {
id
startTimeScheduled
}
}
}
}Second result
The next 10 results
endCursor: “PjMLC1oLC0ZHQE9ACwtaCws=”
{
"data": {
"allSeries": {
"pageInfo": {
"endCursor": "PjMLC1oLC0ZHQE9ACwtaCws=",
"hasNextPage": true
},
"edges": [
{
"node": {
"id": "10776",
"startTimeScheduled": "2020-01-25T20:00:00Z"
}
},
{
"node": {
"id": "10777",
"startTimeScheduled": "2020-01-25T22:00:00Z"
}
},
{
"node": {
"id": "10778",
"startTimeScheduled": "2020-01-26T01:00:00Z"
}
},
{
"node": {
"id": "10779",
"startTimeScheduled": "2020-01-26T23:00:00Z"
}
},
{
"node": {
"id": "10780",
"startTimeScheduled": "2020-01-25T23:00:00Z"
}
},
{
"node": {
"id": "10781",
"startTimeScheduled": "2020-01-26T00:00:00Z"
}
},
{
"node": {
"id": "10782",
"startTimeScheduled": "2020-01-26T20:00:00Z"
}
},
{
"node": {
"id": "10783",
"startTimeScheduled": "2020-01-26T22:00:00Z"
}
},
{
"node": {
"id": "10786",
"startTimeScheduled": "2020-01-25T18:00:00Z"
}
},
{
"node": {
"id": "10787",
"startTimeScheduled": "2020-01-26T21:00:00Z"
}
}
]
}
}
}
🗒️Scratch Pad
- The same logic applies to teams and players
- You can also configure the number of items you would like to receive per page. To learn more please check out this article https://grid.helpjuice.com/2969027