pagination dynamique

This commit is contained in:
Valentin CZERYBA 2022-08-07 17:21:26 +02:00
parent 69f9d1b222
commit 19e7975b1f
2 changed files with 29 additions and 4 deletions

View File

@ -157,9 +157,12 @@
</tbody>
</table>
<div id="page" class="hidden">
<a href="#" id="previous">Précédent</a><span><a href="#"></a>1</span><a href="#" id="next">Suivant</a>
</div>
<nav aria-label="Page navigation" class="hidden" id="page">
<ul class="pagination justify-content-center">
<li class="page-item disabled" id="previousPage"><a class="page-link" href="#" tabindex="-1" aria-disabled="true">Précédent</a></li>
<li class="page-item"><a class="page-link" href="/html/users.html?page=1">1</a></li>
<li class="page-item" id="nextPage"> <a class="page-link" href="#">Suivant</a></li>
</ul>
</div>
</main>
</div>

View File

@ -13,10 +13,32 @@ instance.get("users/count", { withCredentials: true }).then(function(response){
}
if(total > 1){
document.getElementById("page").classList.remove("hidden");
var pageCurrent = getQuery("page");
var page = 1;
if(pageCurrent.length > 0){
page = Number.parseInt(pageCurrent);
}
for (var i=0; i<total; i++){
var liPage = document.querySelectorAll(".page-item")[i+1];
var cloneLi = liPage.cloneNode(true);
liPage.after(cloneLi);
var newPage = i + 2;
var aPage = document.querySelectorAll(".page-item")[newPage].querySelector("a");
aPage.text=newPage;
aPage.href="/html/users.html?page="+newPage;
}
document.querySelectorAll(".page-item")[page].classList.add("active");
if(page != 1){
document.querySelectorAll(".page-item")[0].classList.remove("disabled");
}
if(page == total){
document.querySelectorAll(".page-item")[page].classList.add("disabled");
}
}
});