CODEWITHSUNDEEP
javascriptangularjscheckboxfilter
Jesper
Jesper

Reputation: 2224

AngularJS checkbox filtering not filtering upon page load

jsfiddle here: http://jsfiddle.net/jesperlehtinen/dx05bobb/2/

I have a list of objects which I would like to filter on page load. Basically I have a checkbox like this:

<input type="checkbox" class="form__checkbox" ng-model="filter['processed']">

and a list of items:

<tr data-ng-repeat="card in cards.data | filter:filterByStatus">

the js to filter is in the controller:

$scope.cards = $scope.$parent.cards;

$scope.filter = {};

$scope.filterByStatus = function(card) {
    return $scope.filter[card.status] || noFilter($scope.filter);
};

function noFilter(filterObj){
    for(var key in filterObj){
        if(filterObj[key]){
            return false;
        }
    }
    return true;
}

Right now this works, kind of. When I load the page the checkbox is unchecked, and checking in performs the filtering. However, I would like the checkbox to be checked on load, and also do the filtering. Using ng-checked="true" makes it checked, but it doesn't perform the actual filtering. How could I initialize the checkbox with a value (or function) that makes it both be checked on page load and also perform the filtering?

Upvotes: 1

Views: 224

Answers (2)

Jesper
Jesper

Reputation: 2224

I realized it was as simple as initializing the filter with the default filter value set to true. So $scope.filter = {}; becomes $scope.filter = {'Active':true};.

Upvotes: 2

antish Gajwani
antish Gajwani

Reputation: 70

Initialize you ng-model for checkbox as true using ng-init.

Upvotes: 0

Related Questions