So I am using http://isotope.metafizzy.co to filter out different items on a site. The menu should be a "build up" type where when one category is clicked, it filters to those categories, when the next is clicked it adds those newly clicked categories to the existing filter of categories. When its clicked a second time it should remove that categorie from the filter.
More specifically, I have href with #filter and data-filter=".category-name" I need to have a function that would add ", .another-category" to the end of data-filter value for each of the links with name="filters" (or i can use a class instead of if easier)
<ul>
<li><a href="#filter" onclick="addFilter('.kitchens');" name="filters" data-filter=".kitchens">Kitchens</a></li>
<li><a href="#filter" onclick="addFilter('.bathrooms');" name="filters" data-filter=".bathrooms">Bathrooms</a></li>
<li><a href="#filter" onclick="addFilter('.living-rooms');" name="filters" data-filter=".living-rooms">Living Rooms</a></li>
<li><a href="#filter" onclick="addFilter('.bedrooms');" name="filters" data-filter=".bedrooms">Bedrooms</a></li>
</ul>
I know this function is wrong and doesnt work but its just some pseudo-code
function addFilter(filter) {
names = document.getElementsByName("filters");
for (var name in names) {
name.data-filter = "existing filter, " + filter; // this should be appended to all data-filters
}
}
so basically when a link is clicked it both filters to that category only (lets say kitchens), but also adds the category to the rest of the data-filters (.bedrooms, .kitchens)
javascript or jquery or anything else i may have not realized could work. the documentation for isotope has the option to filter multiple groups of items, but I need it to filter combinations of individual items. Maybe its possible to modify their combination filters to items instead of groups?