Now that we can navigate through pages by passing the page number in the query string let's add some
pagination links to the index page.
First let's add a couple of properties to the paginate a class one for the previous page and one for
the next.
Then in the constructor after we filtered the page value let's assign values to these properties.
The previous page is the current page minus one and the next page is the current page plus one.
Then in the index page after the list of articles we'll add some pagination links as these will be navigation
links will put them inside a nav element and inside that an own ardour list element we can add of the
previous link like this.
An anchor element inside a list item element passing in the value of the previous property of the paginate
an object the same for the link to the next page we pass in the value of the next property of the paginate
object in the query string as before we can omit indexed up HP from the link as it's the default file
served from the server.
Let's give that a try starting at the first page with no value in the query string.
Here are the navigation links and if I click on Next it takes us to page 2 as we can see here in the
query string.
Another click on Next text was to page 3.
If I click on previous We go back to page 2 and again back to PAGE 1.
There is a slight problem however in that on the first page here the previous link is still available
and it takes us to page 0 which the filter converts to page 1.
We can also click next until we get to the last page here where the next link is still available.
If I click it it takes us past the end of the Ricardos and doesn't show any think.
To fix this in the paginate.
Let's only set the value of the previous property if the current page is greater than 1.
This way the previous property will be null.
Its default value if we're on the first page.
Then when we display the link on the index page we can check for this.
And if it's null will just display the word previous without it being a link.
So now when were on page 2 and we click the previous link it takes us to page 1 and the previous link
is no longer there.