metafizzy / isotope

:revolving_hearts: Filter & sort magical layouts
https://isotope.metafizzy.co
11.04k stars 1.42k forks source link

Multiple filters doesn't work well #15

Closed subbu closed 13 years ago

subbu commented 13 years ago

When I have different filters applied to isotope it seems to loose one of the earlier filters. For example, if I have one filter on 'countries' with values india, china and another filter on category with values 'men', 'women' and 'children'. If I have india filter on and go on to apply different values for category, I get to see values from both india and china. It doesn't restrict the values to india.

desandro commented 13 years ago

Do you have a live URL I can look at? If its a confidential project try re-creating the basic functionality in http://jsFiddle.net

subbu commented 13 years ago

I don't have a live url, but here is all the relevant code. Everything else is from the demo code:

  <ul id="playing-roles" class="option-set floated clearfix">
    <li><a href="#type" data-filter="*" class="selected">Everyone</a></li>
    <li><a href="#batsman" data-filter=".batsman">Batsman</a></li>
    <li><a href="#bowler" data-filter=".bowler">Bowler</a></li>
  </ul>
desandro commented 13 years ago

It all depends out how you are putting together the filter for Isotope to use. In the filtering demo, I just use buttons, so each filter gets replaced by the next. In your case, you would want to build some more logic into how the interaction works so that the filters can be used together.

For example, if you want to filter for .au AND .batsman, the appropriate filter would be .au.batsman, but if you want to filter .au OR .batsman, your filter would be .au, .batsman.

jdbo commented 13 years ago

It would be very helpful to add an intersection (or "AND") example to the filtering docs or demos (to supplement the existing union example "alakali and alkaline earth" example) - those just becoming familiar with jQuery selectors (such as myself) might not have figured out that intersections were available (let alone what syntax to use) based on the existing docs/demo.

Thanks for putting together this wonderful library!