KW Online Tools Zone
Knowledge Walls
View All Tools Home
SIMPLE-PAGINATION-IN-JQUERY-EXAMPLE
[Jquery editor]
Run
Share Link
Clear
HTML [Ctrl+Enter] - to run
Abi
Anant
balraj
devi
manasha
mani
nimmi
god
gopal
CSS [Ctrl+Enter] - to run
#divPages{ float:left; } #divPages div{ float:left; margin:5px 10px; }
Jquery [Ctrl+Enter] - to run
$(document).ready(function(){ var totalrows = $(".divControl").length; var pageSize=2; var noOfPage = totalrows/pageSize; noOfPage = Math.ceil(noOfPage); for(var i=1;i<=noOfPage;i++) { $("#divPages").append('
'+i+'
'); } $("div.divControl").hide(); for(var j=1;j<=pageSize;j++) { $("div.divControl:nth-child("+j+")").show(); } $("div.page").click(function(){ var currentPage = $(this).text(); $("div.divControl").hide(); for (var k = (currentPage * pageSize) - (pageSize-1); k <= (currentPage * pageSize); k++) { $("div.divControl:nth-child("+k+")").show(); } }); });
OUTPUT
Copyright © 2021 Knowledge walls, All rights reserved
Copyright © 2021 Knowledge walls, All rights reserved