search

mankindsoftware / angular-isotope

AngularJS directives to easily work with JQuery Isotope.
http://mankindsoftware.github.io/angular-isotope
204 stars 79 forks source link

Checkbox Example? #33

Open that1guy opened 9 years ago

that1guy commented 9 years ago

Bootstrap buttons perform filters as expected.

<button opt-kind ok-key="filter" ng-attr-ok-sel="{{ priceFiltered ? '' : '.hasPrice' }}" class='btn btn-default' ng-model="priceFiltered" ng-click="priceFiltered = !priceFiltered">Must have price</button>

I cannot get checkbox or option elements to work for the life of me.

<input type="checkbox" ng-model="priceFiltered" opt-kind ng-attr-ok-sel="{{ priceFiltered ? '' : '.hasPrice' }}{{ imageFiltered ? '.hasImage' : '' }}" ok-key="filter">

Can you provide an example of how to trigger filter via checkbox or option element. Thanks!

davidtwco commented 9 years ago

I'm having this issue too, can't find a solution yet.

rozanovz commented 8 years ago

Hi, I think this is the solution for filtering with checkboxes $scope.filtersChange = function(){ var checkboxes = document.querySelectorAll('.filters input'); var container = $('#iso-cont'); var filters = []; // get checked checkboxes values checkboxes = Array.prototype.slice.call(checkboxes); checkboxes.filter(function(key){ if(key.checked) return true; }).forEach(function(item){ filters.push('._' + item.value); }); filters = filters.join(', '); container.isotope({ filter: filters }); };