Jquery filter script help

Question

Hello-

I am using a filter script and I am trying to alter the jquery a bit.

(see demo here: http://www.askthecssguy.com/2009/03/checkbox%5Ffilters%5Fwith%5Fjquery%5F1.html)

Now that you've seen the demo, you know that once you uncheck a box, it filters out the results with those tags in it. For instance if you deselect the "wordpress" tag, all items containing that tag are filtered and removed.

BUT, if you have an item with both "wordpress" and "ajax" tags and then unclicked the wordpress checkbox, that item would disappear. I want that item to stay because it still has an unchecked tag (ajax). I only want an item to disappear if all of their tags have been deselected. Can someone take a look at the jquery (bottom half) and tell me where I can change this to make it work?

THANKS!

Answer 1

The code gets kind of complex... I think I would shift strategies to something like this: (inside the input box's click event)

// First get all the checked inputs
var checkedValues = [];
$("input.dynamicFilterInput:checked").each(function() {
 checkedValues.push($(this).val());
});

// Now get all the filterable items
$("ul.filterThis li").each(function() {
 // If the item doesn't have a class that corresponds with one of the
 //    the checked items then hide it
 var found = false;
 for (var i=0; i<checkedValues.length; i++) {
  if ($(this).hasClass(checkedValues[i])) {
   found = true;
   break;
  }
 }
 if (!found) {
  $(this).slideUp();
 } else {
  $(this).slideDown();
 }
});

So basically you recompute the entire list of items every time any one of the inputs is changed.