Question

I want to show 3 records in one page, and click next button to see another 3 records. I try to use jquery plugin easyPaginate to test this, but it is not working.

My HTML

<script>
 $(document).ready(function() {
    var url = "json.json";
        $.getJSON(url, function(result) {
        console.log(result);
        $.each(result, function(i, field) {
           var id = field.id;
           var name = field.name;
           var category = field.category;
             $("#show_data").append("<li class='item'>"+"<div>"+ id +"</div>"+  "<p>"+  name +"</p>" +"<p>" +  category +"</p></li>");
        });
    });
});</script><body><ul id="easyPaginate"><div id="show_data"></div><ul></body>


<script src="js/bootstrap.min.js"></script>
    <script src="js/jquery.snippet.min.js"></script>
    <script src="js/jquery.easyPaginate.js"></script>
    <script src="js/scripts.js"></script>

My Script file

$(function() {
$('#easyPaginate').easyPaginate({
    paginateElement: 'li',
    elementsPerPage: 3,
});  });

MY Json.json file

[{
    "id": "1",
    "name": "Mary",
    "sex": "F"
}, {
    "id": "2",
    "name": "Peter",
    "sex": "M"
}, {
    "id": "3",
    "name": "Ben",
    "sex": "M"
}, {
    "id": "4",
    "name": "Sam",
    "sex": "M"
}, {
    "id": "5",
    "name": "April",
    "sex": "F"
}, {
    "id": "6",
    "name": "Benson",
    "sex": "M"
}]

How to do pagination of JSON data?

My HTML

0 个答案: