If you’re building a web application with Spring Boot, you may need to display large amounts of data on a single page. However, displaying all the data at once can be overwhelming and slow down the page. That’s where pagination comes in. Pagination allows you to split large data sets into smaller, more manageable pages. In this tutorial, we’ll show you how to implement pagination in Spring Boot using Thymeleaf.
Implementation
To implement pagination in Spring Boot, you’ll need to follow these steps:
- Create a Spring Boot project with Thymeleaf dependencies.
- Create a Controller that handles pagination requests.
- Implement pagination logic in the Controller.
- Create a Thymeleaf template that displays paginated data.
- Add pagination controls to the template.
1. Create a Spring Boot project with Thymeleaf dependencies
To get started, create a new Spring Boot project in your IDE. Make sure to include the Thymeleaf dependencies in your pom.xml file:
<dependency> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-thymeleaf</artifactId> </dependency>
2. Create a Controller that handles pagination requests
Create a new Controller class that handles pagination requests. Here’s an example:
@Controller public class PaginationController { @Autowired private EmployeeService employeeService; @GetMapping("/") public String homePage(Model model, @RequestParam(defaultValue = "0") int page) { Page<Employee> employees = employeeService.findAll(PageRequest.of(page, 10)); model.addAttribute("employees", employees); model.addAttribute("currentPage", page); return "index"; } }
In this example, we’re using Spring Data’s Page
and PageRequest
classes to implement pagination. The homePage()
method takes an optional page
parameter, which defaults to 0 if not provided. We then use this parameter to fetch the appropriate page of data from the EmployeeService
. Finally, we add the employees
and currentPage
attributes to the model and return the index
template.
3. Implement pagination logic in the Controller
Now that we have a Controller that handles pagination requests, we need to implement the pagination logic. We can do this by adding the following code to the homePage()
method:
model.addAttribute("totalPages", employees.getTotalPages());
This code adds a totalPages
attribute to the model, which contains the total number of pages in the data set. We can use this attribute to generate pagination controls in the Thymeleaf template.
4. Create a Thymeleaf template that displays paginated data
Create a new Thymeleaf template called index.html
. Here’s an example:
<!DOCTYPE html> <html xmlns:th="http://www.thymeleaf.org"> <head> <title>Pagination Example</title> </head> <body> <table> <thead> <tr> <th>ID</th> <th>Name</th> <th>Email</th> </tr> </thead> <tbody> <tr th:each="employee : ${employees.content}"> <td th:text="${employee.id}"></td> <td th:text="${employee.name}"></td> <td th:text="${employee.email}"></td> </tr> </tbody> </table> <div class="pagination"> <ul> <li th:class="${currentPage == 0} ? disabled : ''"> <a th:href="@{/}?page=0">First</a> </li> <li th:class="${currentPage == 0} ? disabled : ''"> <a th:href="@{/(page=${currentPage - 1})}"><</a> </li> <li th:class="${currentPage == totalPages - 1} ? disabled : ''"> <a th:href="@{/(page=${currentPage + 1})}">></a> </li> <li th:class="${currentPage == totalPages - 1} ? disabled : ''"> <a th:href="@{/(page=${totalPages - 1})}">Last</a> </li> </ul> </div> </body> </html>
In this template, we display the paginated data in a table. We use Thymeleaf’s th:each
attribute to iterate over the content of the current page, and display each employee’s ID, name, and email in separate columns. We also add a pagination
div that contains pagination controls, which allows the user to navigate between pages.
5. Add pagination controls to the template
To add pagination controls to the template, we use Thymeleaf’s th:class
attribute to conditionally apply the disabled
class to the first and last pagination controls when the user is on the first or last page. We also use Thymeleaf’s th:href
attribute to generate URLs for the previous, next, first, and last pagination controls.

Conclusion
In this tutorial, we’ve shown you how to implement pagination in Spring Boot using Thymeleaf. By splitting large data sets into smaller, more manageable pages, you can create a more user-friendly experience for your application’s users. With the help of Spring Data’s Page
and PageRequest
classes, and Thymeleaf’s powerful templating engine, pagination in Spring Boot is easy to implement and customize.