themes

Build an AJAX Gallery Filter

Filter gallery items by custom taxonomies and load results dynamically using AJAX.

/* ===============================================================
   Set the here code for the gallery page filter 
===============================================================*/
jQuery('.clear-filter-btn').hide();
if (jQuery('.gallery-filter input:checkbox').is(":checked")) {
    jQuery('#offset').val(0);
    isLoaded = true;
    jQueryhtml = 'html';
    gallery_post_show(jQueryhtml);
    if (jQuery('.gallery-filter input[type="checkbox"]:checked').length) {
        jQuery('.clear-filter-btn').show();
    } else {
        jQuery('.clear-filter-btn').hide();
    }
}
jQuery(".gallery_loadmore").on('click', function() {
    jQueryhtml = 'append';
    gallery_post_show(jQueryhtml);
});
jQuery('.gallery-filter input:checkbox').on('change', function() {
    jQuery('#offset').val(0);
    isLoaded = true;
    jQueryhtml = 'html';
    gallery_post_show(jQueryhtml);
    if (jQuery('.gallery-filter input[type="checkbox"]:checked').length) {
        jQuery('.clear-filter-btn').show();
    } else {
        jQuery('.clear-filter-btn').hide();
    }
});
jQuery(document).on('click', '.clear-filter-btn', function() {
    jQuery('.gallery-filter input[type="checkbox"]:checked').prop('checked', false);
    jQuery('#offset').val(0);
    jQueryhtml = 'html';
    isLoaded = true;
    gallery_post_show(jQueryhtml);
    jQuery('.clear-filter-btn').hide();
})

Leave a reply

Your email address will not be published. Required fields are marked *