flaviusmatis/simplePagination.js

if you have trouble with bootstrap flex hide issue you have to remove the class first then hide it

Opened this issue · 0 comments

var items = $(".list-wrapper .part_data");
var numItems = items.length;
var perPage = 5;

     //remove class first then hide
    items.slice(perPage).removeClass("list-group-item list-group-item-action d-flex align-items-center part_data").hide();

    $('#pagination-container').pagination({
        items: numItems,
        itemsOnPage: perPage,
        prevText: "«",
        nextText: "»",
        onPageClick: function (pageNumber) {
            var showFrom = perPage * (pageNumber - 1);
            var showTo = showFrom + perPage;

            //remove curent showing active class then hide, and the new list add the class again then show
            items.removeClass("list-group-item list-group-item-action d-flex align-items-center part_data").hide().slice(showFrom, showTo).addClass("list-group-item list-group-item-action d-flex align-items-center part_data").show();

        }
    });