I'm using jQuery isotope. Everything is ok but I have problem with filtering. I want to use multiple categories I have 5 checkboxes and I can't use them at the same time. What can I do?

$("#classic").click(function() {
    if($("#classic").is(":checked")) {
    $('#box').isotope({ filter: '.classic' });
    } else {
    $('#box').isotope({ filter: '' });
    }
});

Example

my items = a,b,c,d,e,f,g,h

categories = x ( a,b,e) y (c,h) z(d,f,g)

now if I choose the x and z checkbox it only show the a,b,e,d,f,g

but I can't do that. How can I do ?

I'm using jQuery isotope. Everything is ok but I have problem with filtering. I want to use multiple categories I have 5 checkboxes and I can't use them at the same time. What can I do?

$("#classic").click(function() {
    if($("#classic").is(":checked")) {
    $('#box').isotope({ filter: '.classic' });
    } else {
    $('#box').isotope({ filter: '' });
    }
});

Example

my items = a,b,c,d,e,f,g,h

categories = x ( a,b,e) y (c,h) z(d,f,g)

now if I choose the x and z checkbox it only show the a,b,e,d,f,g

but I can't do that. How can I do ?

• javascript
• jquery
• checkbox
• filter
• jquery-isotope

2 Answers 2

Here is a solution for checkbox filtering: http://jsfiddle/3nY9V/6/

Looks like you have a js error in the code(missing single quote) and also at one place classic is used as an id and at another place as a class. Just wanted to find if thats not the issue. Try this.

function checkIsoTope(){
    var ids = [];
    $("#classic, #den, #wer").filter(":checked").each(function(){
      ids.push("." + this.id);
    });    
    $('#box').isotope({ filter: ids.join(',')});
}
$("#classic, #den, #wer, #allCheckboxId").click(checkIsoTope);