Question: Load more without using ajax
Jack94son opened this issue · comments
Hi,
Thanks for the library and I been using this library almost all my projects.
Wondering, is there any way/suggestion/sample for loading more item without using ajax (locally)?
On first load its work as but when clicked on other filter then the items must be all show instead on hiding.
Below are my function:
_loadMore():
var $container = 'lists',
$itemPerPage = $j('#' + $container).data("show-per-page"),
$visibleItems = $j('#' + $container).find('.shuffle-item--visible'),
$totalVisibleItems = this.shuffle.visibleItems,
$hiddenItem = $j('#' + $container).find('.shuffle-item--visible:hidden');
if ($totalVisibleItems > $itemPerPage) {
$visibleItems.hide();
$visibleItems.slice(0, $itemPerPage).show();
$j('.loadmore').show();
document.querySelector('.loadmore').addEventListener('click', this.loadItems.bind(this));
} else {
$visibleItems.show();
$j('.loadmore').hide();
}
loadItems():
$hiddenItem.slice(0, $itemPerPage).fadeIn().each(function() {
window.customshuffle = new CustomShuffle(document.getElementById($container));
});
if ($j('.shuffle-item--visible:hidden').length === 0) {
$j('.loadmore').fadeOut("slow");
}
Appreciate for an advice/help!