Thank you! Your feedback has been delivered
Thank you! Your feedback has been sent

Isotope - Search and 3 botton filter-groups

I have made a Isotope with search filter and 3 botton-filters. Search filter only works as long as the botton-filters have not been activated. Botton-filters work all the time. I'm quite sure it's this line

var buttonResult = buttonFilter ? $this.is( buttonFilter ) : true;

which have to be changed to something from these lines

var $buttonGroup = $this.parents('.button-group');
var filterGroup = $buttonGroup.attr('data-filter-group');
var $buttonGroup = $this.parents('.button-group');
var filterGroup = $buttonGroup.attr('data-filter-group');

But how`?

http://codepen.io/KlintMX/pen/msCgn?

User Gravatar

KlintMX

Posted Jun 25 2014 15:31 UTC

$25


  • Assigned To Gaby
  • Solved
  • isotope
    isotope filters
  • 858 Views

2 Replies


You need to assign the filters to the buttonFilter variable.

So, change the filter handler to

$('#filters').on( 'click', '.button', function() {
    var $this = $(this);
    // get group key
    var $buttonGroup = $this.parents('.button-group');
    var filterGroup = $buttonGroup.attr('data-filter-group');
    // set filter for group
    filters[ filterGroup ] = $this.attr('data-filter');
    // combine filters
    var filterValue = '';
    for ( var prop in filters ) {
      filterValue += filters[ prop ];
    }

    /*ADD THE FOLLOWING LINE 
      AND REMOVE THE PARAMS FROM THE .isotope() CALL AFTER IT*/
    buttonFilter = filterValue;

    // set filter for Isotope
    $container.isotope();
});

Updated demo at http://codepen.io/gpetrioli/pen/yqcvd

User Gravatar

Gaby

Posted Jun 25 2014 15:45 UTC

Solution

This didn't solve your task? Get your own custom solution.

Thanks for the quick response - seems to work perfect I might return with a few other details that I would like to have added: Number of each type (button) Year: 'All' 'Current year - 6 years (2014-6 = 2008) or later' 'Current year - 7 years (2014-7 = 2007) or older' I do my own text to the buttons with PHP

User Gravatar

KlintMX

Posted Jun 25 2014 16:27 UTC

Add a reply

By posting a reply on CodersClan you agree to our Terms & Conditions