title: Spring + Thymeleaf - how to implement pagination for a list
body: <p>I am developing a simple application using Spring + Thymeleaf. On one of the pages I have a list of items which needs to be paginated.</p>
  
  <p>Ideally I would like to only send the <code>currPageNo</code> (the number of the current page) and <code>numOfPages</code> (the total number of pages) variables to the view and the rest of the work would be done in there (this is a presentation issue and has nothing to do with the business logic). If, however, the cleanest solution would require me to do some computation in the controller first, I would accept it as a small evil.</p>
  
  <p>I would like to get the list of pages in the following form.</p>
  
  <pre><code>&lt;Prev | 1 | ... | 3 | 4 | 5 | 6 | 7 | ... | 15 | Next&gt;
  </code></pre>
  
  <p>I was only able to come with the following solution. It works but I believe that you will agree that it is very messy and really hard to read.</p>
  
  <p>Moreover, in addition to <code>currPageNo</code> and <code>numOfPages</code> I had to send two more variables to the view. The ideal solution would not require me to do that.</p>
  
  <pre><code>firstPageNo = Math.max(2, currPageNo - 2)
  lastPageNo = Math.min(numOfPages - 1, currPageNo + 2)
  </code></pre>
  
  <p>The current version of my code follows.</p>
  
  <pre><code>&lt;ul&gt;
      &lt;li th:if="${currPageNo &amp;gt; 1}"&gt;
          &lt;a th:href="@{/items.html(pageNo = ${currPageNo - 1})}" href=""&gt;&amp;lt; Prev&lt;/a&gt;
      &lt;/li&gt;
      &lt;li th:class="${currPageNo == 1} ? 'selected'"&gt;
          &lt;a th:href="@{/items.html(pageNo = 1)}" th:if="${currPageNo &amp;gt; 1}" href=""&gt;1&lt;/a&gt;
          &lt;span th:if="${currPageNo == 1}"&gt;1&lt;/span&gt;
      &lt;/li&gt;
      &lt;li th:if="${currPageNo &amp;gt;= 5}"&gt;
          ...
      &lt;/li&gt;
      &lt;li th:each="pageNo : ${#numbers.sequence(firstPageNo, lastPageNo)}"  th:class="${currPageNo == pageNo} ? 'selected'"&gt;
          &lt;a th:href="@{/items.html(pageNo = ${pageNo})}" th:if="${pageNo != currPageNo}" th:text="${pageNo}" href=""&gt;2&lt;/a&gt;
          &lt;span th:if="${pageNo == currPageNo}" th:text="${pageNo}"&gt;2&lt;/span&gt;
      &lt;/li&gt;
      &lt;li th:if="${currPageNo &amp;lt;= (numOfPages - 4)}"&gt;
          ...
      &lt;/li&gt;
      &lt;li th:class="${currPageNo == numOfPages} ? 'selected'"&gt;
          &lt;a th:href="@{/items.html(pageNo = ${numOfPages})}" th:if="${currPageNo &amp;lt; numOfPages}" th:text="${numOfPages}" href=""&gt;10&lt;/a&gt;
          &lt;span th:if="${currPageNo == numOfPages}" th:text="${numOfPages}"&gt;1&lt;/span&gt;
      &lt;/li&gt;
      &lt;li th:if="${currPageNo &amp;lt; numOfPages}"&gt;
          &lt;a th:href="@{/items.html(pageNo = ${currPageNo + 1})}" href=""&gt; Next &amp;gt;&lt;/a&gt;
      &lt;/li&gt;
  &lt;/ul&gt;
  </code></pre>
  
  <p>The following list sumarizes the issues that I would like to get rid of the most. I understand that some of them are inherent to the platform but still, the list seems to be quit long and the code messy.</p>
  
  <ul>
  <li>Having to send the precomputed values of <code>firstPageNo</code> and <code>lastPageNo</code> to the view from the controller.</li>
  <li>Having to use <code>&amp;lt;</code> instead of <code>&lt;</code> in the expressions.</li>
  <li>Having to use both an anchor and a span with mutually exclusive conditions in order for the browser not to use a link for the current page.</li>
  </ul>
  
  <p>I also welcome any other suggestions about how to improve the quality of the code.</p>
  
  <hr>
  
  <p>I understand that perhaps this question would be a better fit for the Code Review site, but, as Thymeleaf seems to be a technology with a tiny user base yet, I expect a reasonable answer rather here on Stack Overflow, which has a much greater user base (I believe).</p>
  
  <p>If, however, such a question is really not welcome here, please consider moving it to the right site instead of closing it so that I get the advice I need.</p>