<?php
/**
* Attaches a click event to a div that selects all of a Checkboxes facet's available options and triggers a refresh.
* Change "product_categories" to the name of your facet (3x)
* Add this HTML above your facet:
* <div class="facetwp-checkbox select-all">Select all</div>
* It creates a div that looks like facet checkboxes. Note that this needs to be outside the facet itself to work.
*/
add_action( 'wp_head', function() { ?>
<script>
(function($) {
$(document).ready(function() {
$(".select-all").click(function () {
if ( $(this).hasClass('checked') ) {
FWP.reset('product_categories');
} else {
var available = [];
$( '.facetwp-facet-product_categories .facetwp-checkbox' ).each( function (index, item) {
available.push( $(item).attr( 'data-value' ) );
});
FWP.facets['product_categories'] = available;
FWP.is_reset = true; // don't parse facets
FWP.refresh();
}
$(this).toggleClass('checked');
});
});
})(jQuery);
</script>
<?php });