Add page-size dropdown to pagination controls

This commit is contained in:
2026-04-30 20:42:35 -05:00
parent 4ec7d22138
commit fa22e98060
2 changed files with 17 additions and 1 deletions
+9 -1
View File
@@ -306,6 +306,14 @@
<span id="page-info" style="color:var(--text-muted);font-size:0.9rem;"></span> <span id="page-info" style="color:var(--text-muted);font-size:0.9rem;"></span>
<button id="next-page" class="btn btn-sm btn-secondary" type="button" <button id="next-page" class="btn btn-sm btn-secondary" type="button"
onclick="currentPage++; applyPagination();" disabled>Next &#8594;</button> onclick="currentPage++; applyPagination();" disabled>Next &#8594;</button>
<select id="page-size-select" onchange="PAGE_SIZE=+this.value||Infinity;currentPage=1;applyPagination();"
style="padding:0.2rem 0.4rem;font-size:0.85rem;border:1px solid #cbd5e1;border-radius:4px;">
<option value="10">10 / page</option>
<option value="25" selected>25 / page</option>
<option value="50">50 / page</option>
<option value="100">100 / page</option>
<option value="">All</option>
</select>
</div> </div>
</form> </form>
@@ -316,7 +324,7 @@ var selectAll = document.getElementById('select-all');
var toolbar = document.getElementById('bulk-toolbar'); var toolbar = document.getElementById('bulk-toolbar');
var countEl = document.getElementById('selected-count'); var countEl = document.getElementById('selected-count');
var selectAllBtn = document.getElementById('select-all-btn'); var selectAllBtn = document.getElementById('select-all-btn');
var PAGE_SIZE = 50; var PAGE_SIZE = 25;
var currentPage = 1; var currentPage = 1;
function visibleCbs() { function visibleCbs() {
+8
View File
@@ -116,6 +116,14 @@
<span id="dev-page-info" style="color:var(--text-muted);font-size:0.9rem;"></span> <span id="dev-page-info" style="color:var(--text-muted);font-size:0.9rem;"></span>
<button id="dev-next-page" class="btn btn-sm btn-secondary" type="button" <button id="dev-next-page" class="btn btn-sm btn-secondary" type="button"
onclick="devCurrentPage++; applyDevicePagination();" disabled>Next &#8594;</button> onclick="devCurrentPage++; applyDevicePagination();" disabled>Next &#8594;</button>
<select id="dev-page-size-select" onchange="DEV_PAGE_SIZE=+this.value||Infinity;devCurrentPage=1;applyDevicePagination();"
style="padding:0.2rem 0.4rem;font-size:0.85rem;border:1px solid #cbd5e1;border-radius:4px;">
<option value="10">10 / page</option>
<option value="25" selected>25 / page</option>
<option value="50">50 / page</option>
<option value="100">100 / page</option>
<option value="">All</option>
</select>
</div> </div>
</div> </div>