<p>Somehow you would just need to communicate to your template that you are changing the default limit.</p>

<p>A fairly simple/standard way is through a query string, and then looking for the value of the variable.</p>

<p>The two things you need to accomplish are</p>

<ol>
<li>Setting the query string if someone changes the dropdown box</li>
<li>Checking for a value of the query string key in your code.</li>
</ol>

<p>To set a query string, you could do it a couple of different ways. The easiest way would actually be to submit your form:</p>

<pre><code>&lt;div class="grid-show"&gt;
    &lt;form action="" method="get"&gt;
        &lt;select name="limit"&gt;
            &lt;option value="12"&gt;12&lt;/option&gt;
            &lt;option value="20"&gt;20&lt;/option&gt;
            &lt;option value="50"&gt;50&lt;/option&gt;
        &lt;/select&gt;
        &lt;input type="submit" /&gt;
    &lt;/form&gt;
&lt;/div&gt;
</code></pre>

<p>The second step involves checking for the value of the query string within your Twig and if it's not set default to 12:</p>

<pre><code>{% paginate craft.entries({
    section: 'holidayHomes',
    limit: craft.request.getParam('limit') ?? 12,
}) as pageInfo, pageEntries %}
</code></pre>

<p>If you wanted this to happen via Ajax it would be a bit more involved, but the principle is the same, ie look for a query string variable and use that as your limit.</p>

CC BY-SA 3.0
2017-09-11T19:27:34.583Z
2017-09-11T19:27:34.583Z
Peter Tell
<p>On a entries (listing) page I'm using pagination and a fixed limit of entries set. I want visitors to be able to select (dropdown) the number of entries that should be listed (limit).</p>

<p>I'm not a Java or AJAX expert can someone show me the way?</p>

<pre><code>&lt;div class="grid-show"&gt;
   &lt;select&gt;
      &lt;option value="12"&gt;12&lt;/option&gt;
      &lt;option value="20"&gt;20&lt;/option&gt;
      &lt;option value="50"&gt;50&lt;/option&gt;
   &lt;/select&gt;
&lt;/div&gt;

{% paginate craft.entries({
    section: 'holidayHomes',
    limit: 12 ,
}) as pageInfo, pageEntries %}

{% for entry in pageEntries %}

      &lt;div class="cdescription"&gt;
          &lt;a href="{{ entry.url }}" &gt;{{ entry.title }}&lt;/a&gt;
          &lt;p&gt;{{ entry.body | striptags | slice(0,300)~'...' }}&lt;/p&gt;
      &lt;/div&gt;

{% endfor %}
</code></pre>

<entries><ajax><javascript><limit>
Dynamic entries limit via dropdown
# Dynamic entries limit via dropdown

(Asked by: username_0 on 2017-09-11)

On a entries (listing) page I'm using pagination and a fixed limit of entries set. I want visitors to be able to select (dropdown) the number of entries that should be listed (limit).
I'm not a Java or AJAX expert can someone show me the way?

   
      12
      20
      50
   


{% paginate craft.entries({
    section: 'holidayHomes',
    limit: 12 ,
}) as pageInfo, pageEntries %}

{% for entry in pageEntries %}

      
          {{ entry.title }}
          {{ entry.body | striptags | slice(0,300)~'...' }}
      

{% endfor %}

**Tags:** entries, ajax, javascript, limit


---

## 1 answers

### Answer by username_1 on 2017-09-11. Score: 1

Somehow you would just need to communicate to your template that you are changing the default limit.
A fairly simple/standard way is through a query string, and then looking for the value of the variable.
The two things you need to accomplish are

Setting the query string if someone changes the dropdown box
Checking for a value of the query string key in your code.

To set a query string, you could do it a couple of different ways. The easiest way would actually be to submit your form:

    
        
            12
            20
            50
        
        
    


The second step involves checking for the value of the query string within your Twig and if it's not set default to 12:
{% paginate craft.entries({
    section: 'holidayHomes',
    limit: craft.request.getParam('limit') ?? 12,
}) as pageInfo, pageEntries %}

If you wanted this to happen via Ajax it would be a bit more involved, but the principle is the same, ie look for a query string variable and use that as your limit.


---

