add limit paginations
This commit is contained in:
ssbg04 committed
1 parent
ca49fde770
commit
091b7e1c92
3 files changed
+205
-75
No files matched your search
+71
-6
@@ -117,12 +117,77 @@ $(document).ready(function () {
|
||||
}
|
||||
|
||||
function renderInventoryPagination(totalPages) {
|
||||
let paginationHtml = `<li class="page-item ${inventoryCurrentPage === 1 ? "disabled" : ""}"><a class="page-link" href="#" onclick="changeInventoryPage(${inventoryCurrentPage - 1}); return false;">Previous</a></li>`;
|
||||
for (let i = 1; i <= totalPages; i++) {
|
||||
paginationHtml += `<li class="page-item ${inventoryCurrentPage === i ? "active" : ""}"><a class="page-link" href="#" onclick="changeInventoryPage(${i}); return false;">${i}</a></li>`;
|
||||
}
|
||||
paginationHtml += `<li class="page-item ${inventoryCurrentPage === totalPages ? "disabled" : ""}"><a class="page-link" href="#" onclick="changeInventoryPage(${inventoryCurrentPage + 1}); return false;">Next</a></li>`;
|
||||
$("#inventoryPaginationControls").html(paginationHtml);
|
||||
let paginationHtml = '';
|
||||
|
||||
// Previous Button
|
||||
paginationHtml += `
|
||||
<li class="page-item ${inventoryCurrentPage === 1 ? "disabled" : ""}">
|
||||
<a class="page-link" href="#" onclick="changeInventoryPage(${inventoryCurrentPage - 1}); return false;">
|
||||
Previous
|
||||
</a>
|
||||
</li>
|
||||
`;
|
||||
|
||||
let startPage = Math.max(1, inventoryCurrentPage - 2);
|
||||
let endPage = Math.min(totalPages, inventoryCurrentPage + 2);
|
||||
|
||||
// First Page
|
||||
if (startPage > 1) {
|
||||
paginationHtml += `
|
||||
<li class="page-item">
|
||||
<a class="page-link" href="#" onclick="changeInventoryPage(1); return false;">1</a>
|
||||
</li>
|
||||
`;
|
||||
|
||||
if (startPage > 2) {
|
||||
paginationHtml += `
|
||||
<li class="page-item disabled">
|
||||
<span class="page-link">...</span>
|
||||
</li>
|
||||
`;
|
||||
}
|
||||
}
|
||||
|
||||
// Middle Pages
|
||||
for (let i = startPage; i <= endPage; i++) {
|
||||
paginationHtml += `
|
||||
<li class="page-item ${inventoryCurrentPage === i ? "active" : ""}">
|
||||
<a class="page-link" href="#" onclick="changeInventoryPage(${i}); return false;">
|
||||
${i}
|
||||
</a>
|
||||
</li>
|
||||
`;
|
||||
}
|
||||
|
||||
// Last Page
|
||||
if (endPage < totalPages) {
|
||||
if (endPage < totalPages - 1) {
|
||||
paginationHtml += `
|
||||
<li class="page-item disabled">
|
||||
<span class="page-link">...</span>
|
||||
</li>
|
||||
`;
|
||||
}
|
||||
|
||||
paginationHtml += `
|
||||
<li class="page-item">
|
||||
<a class="page-link" href="#" onclick="changeInventoryPage(${totalPages}); return false;">
|
||||
${totalPages}
|
||||
</a>
|
||||
</li>
|
||||
`;
|
||||
}
|
||||
|
||||
// Next Button
|
||||
paginationHtml += `
|
||||
<li class="page-item ${inventoryCurrentPage === totalPages ? "disabled" : ""}">
|
||||
<a class="page-link" href="#" onclick="changeInventoryPage(${inventoryCurrentPage + 1}); return false;">
|
||||
Next
|
||||
</a>
|
||||
</li>
|
||||
`;
|
||||
|
||||
$("#inventoryPaginationControls").html(paginationHtml);
|
||||
}
|
||||
|
||||
window.changeInventoryPage = function(newPage) {
|
||||
|
||||
+71
-6
@@ -105,12 +105,77 @@ $(document).ready(function () {
|
||||
}
|
||||
|
||||
function renderIssuedPagination(totalPages) {
|
||||
let html = `<li class="page-item ${issuedCurrentPage === 1 ? "disabled" : ""}"><a class="page-link" href="#" onclick="changeIssuedPage(${issuedCurrentPage - 1}); return false;">Previous</a></li>`;
|
||||
for (let i = 1; i <= totalPages; i++) {
|
||||
html += `<li class="page-item ${issuedCurrentPage === i ? "active" : ""}"><a class="page-link" href="#" onclick="changeIssuedPage(${i}); return false;">${i}</a></li>`;
|
||||
}
|
||||
html += `<li class="page-item ${issuedCurrentPage === totalPages ? "disabled" : ""}"><a class="page-link" href="#" onclick="changeIssuedPage(${issuedCurrentPage + 1}); return false;">Next</a></li>`;
|
||||
$("#issuedPaginationControls").html(html);
|
||||
let html = '';
|
||||
|
||||
// Previous Button
|
||||
html += `
|
||||
<li class="page-item ${issuedCurrentPage === 1 ? "disabled" : ""}">
|
||||
<a class="page-link" href="#" onclick="changeIssuedPage(${issuedCurrentPage - 1}); return false;">
|
||||
Previous
|
||||
</a>
|
||||
</li>
|
||||
`;
|
||||
|
||||
let startPage = Math.max(1, issuedCurrentPage - 2);
|
||||
let endPage = Math.min(totalPages, issuedCurrentPage + 2);
|
||||
|
||||
// First Page
|
||||
if (startPage > 1) {
|
||||
html += `
|
||||
<li class="page-item">
|
||||
<a class="page-link" href="#" onclick="changeIssuedPage(1); return false;">1</a>
|
||||
</li>
|
||||
`;
|
||||
|
||||
if (startPage > 2) {
|
||||
html += `
|
||||
<li class="page-item disabled">
|
||||
<span class="page-link">...</span>
|
||||
</li>
|
||||
`;
|
||||
}
|
||||
}
|
||||
|
||||
// Middle Pages
|
||||
for (let i = startPage; i <= endPage; i++) {
|
||||
html += `
|
||||
<li class="page-item ${issuedCurrentPage === i ? "active" : ""}">
|
||||
<a class="page-link" href="#" onclick="changeIssuedPage(${i}); return false;">
|
||||
${i}
|
||||
</a>
|
||||
</li>
|
||||
`;
|
||||
}
|
||||
|
||||
// Last Page
|
||||
if (endPage < totalPages) {
|
||||
if (endPage < totalPages - 1) {
|
||||
html += `
|
||||
<li class="page-item disabled">
|
||||
<span class="page-link">...</span>
|
||||
</li>
|
||||
`;
|
||||
}
|
||||
|
||||
html += `
|
||||
<li class="page-item">
|
||||
<a class="page-link" href="#" onclick="changeIssuedPage(${totalPages}); return false;">
|
||||
${totalPages}
|
||||
</a>
|
||||
</li>
|
||||
`;
|
||||
}
|
||||
|
||||
// Next Button
|
||||
html += `
|
||||
<li class="page-item ${issuedCurrentPage === totalPages ? "disabled" : ""}">
|
||||
<a class="page-link" href="#" onclick="changeIssuedPage(${issuedCurrentPage + 1}); return false;">
|
||||
Next
|
||||
</a>
|
||||
</li>
|
||||
`;
|
||||
|
||||
$("#issuedPaginationControls").html(html);
|
||||
}
|
||||
|
||||
window.changeIssuedPage = function(newPage) {
|
||||
|
||||
+63
-63
@@ -116,78 +116,78 @@ $(document).ready(function () {
|
||||
}
|
||||
|
||||
function renderPOPagination(totalPages) {
|
||||
let paginationHtml = '';
|
||||
let paginationHtml = '';
|
||||
|
||||
// Previous Button
|
||||
paginationHtml += `
|
||||
<li class="page-item ${poCurrentPage === 1 ? "disabled" : ""}">
|
||||
<a class="page-link" href="#" onclick="changePOPage(${poCurrentPage - 1}); return false;">
|
||||
Previous
|
||||
</a>
|
||||
</li>
|
||||
`;
|
||||
// Previous Button
|
||||
paginationHtml += `
|
||||
<li class="page-item ${poCurrentPage === 1 ? "disabled" : ""}">
|
||||
<a class="page-link" href="#" onclick="changePOPage(${poCurrentPage - 1}); return false;">
|
||||
Previous
|
||||
</a>
|
||||
</li>
|
||||
`;
|
||||
|
||||
let startPage = Math.max(1, poCurrentPage - 2);
|
||||
let endPage = Math.min(totalPages, poCurrentPage + 2);
|
||||
let startPage = Math.max(1, poCurrentPage - 2);
|
||||
let endPage = Math.min(totalPages, poCurrentPage + 2);
|
||||
|
||||
// Always show first page
|
||||
if (startPage > 1) {
|
||||
paginationHtml += `
|
||||
<li class="page-item">
|
||||
<a class="page-link" href="#" onclick="changePOPage(1); return false;">1</a>
|
||||
</li>
|
||||
`;
|
||||
// Always show first page
|
||||
if (startPage > 1) {
|
||||
paginationHtml += `
|
||||
<li class="page-item">
|
||||
<a class="page-link" href="#" onclick="changePOPage(1); return false;">1</a>
|
||||
</li>
|
||||
`;
|
||||
|
||||
if (startPage > 2) {
|
||||
paginationHtml += `
|
||||
<li class="page-item disabled">
|
||||
<span class="page-link">...</span>
|
||||
</li>
|
||||
`;
|
||||
}
|
||||
}
|
||||
if (startPage > 2) {
|
||||
paginationHtml += `
|
||||
<li class="page-item disabled">
|
||||
<span class="page-link">...</span>
|
||||
</li>
|
||||
`;
|
||||
}
|
||||
}
|
||||
|
||||
// Middle Pages
|
||||
for (let i = startPage; i <= endPage; i++) {
|
||||
paginationHtml += `
|
||||
<li class="page-item ${poCurrentPage === i ? "active" : ""}">
|
||||
<a class="page-link" href="#" onclick="changePOPage(${i}); return false;">
|
||||
${i}
|
||||
</a>
|
||||
</li>
|
||||
`;
|
||||
}
|
||||
// Middle Pages
|
||||
for (let i = startPage; i <= endPage; i++) {
|
||||
paginationHtml += `
|
||||
<li class="page-item ${poCurrentPage === i ? "active" : ""}">
|
||||
<a class="page-link" href="#" onclick="changePOPage(${i}); return false;">
|
||||
${i}
|
||||
</a>
|
||||
</li>
|
||||
`;
|
||||
}
|
||||
|
||||
// Always show last page
|
||||
if (endPage < totalPages) {
|
||||
if (endPage < totalPages - 1) {
|
||||
paginationHtml += `
|
||||
<li class="page-item disabled">
|
||||
<span class="page-link">...</span>
|
||||
</li>
|
||||
`;
|
||||
}
|
||||
// Always show last page
|
||||
if (endPage < totalPages) {
|
||||
if (endPage < totalPages - 1) {
|
||||
paginationHtml += `
|
||||
<li class="page-item disabled">
|
||||
<span class="page-link">...</span>
|
||||
</li>
|
||||
`;
|
||||
}
|
||||
|
||||
paginationHtml += `
|
||||
<li class="page-item">
|
||||
<a class="page-link" href="#" onclick="changePOPage(${totalPages}); return false;">
|
||||
${totalPages}
|
||||
</a>
|
||||
</li>
|
||||
`;
|
||||
}
|
||||
paginationHtml += `
|
||||
<li class="page-item">
|
||||
<a class="page-link" href="#" onclick="changePOPage(${totalPages}); return false;">
|
||||
${totalPages}
|
||||
</a>
|
||||
</li>
|
||||
`;
|
||||
}
|
||||
|
||||
// Next Button
|
||||
paginationHtml += `
|
||||
<li class="page-item ${poCurrentPage === totalPages ? "disabled" : ""}">
|
||||
<a class="page-link" href="#" onclick="changePOPage(${poCurrentPage + 1}); return false;">
|
||||
Next
|
||||
</a>
|
||||
</li>
|
||||
`;
|
||||
// Next Button
|
||||
paginationHtml += `
|
||||
<li class="page-item ${poCurrentPage === totalPages ? "disabled" : ""}">
|
||||
<a class="page-link" href="#" onclick="changePOPage(${poCurrentPage + 1}); return false;">
|
||||
Next
|
||||
</a>
|
||||
</li>
|
||||
`;
|
||||
|
||||
$("#poPaginationControls").html(paginationHtml);
|
||||
}
|
||||
$("#poPaginationControls").html(paginationHtml);
|
||||
}
|
||||
|
||||
window.changePOPage = function(newPage) {
|
||||
poCurrentPage = newPage;
|
||||
|
||||
Reference in new issue
Block a user