myTD
myTD

Reputation: 1469

AngularJS : angular-ui-grid showing rows based on the condition

I would like my grid to show rows that only matches a creteria. For example i want my grid to show only the rows where name is Brian.

var app = angular.module('app', ['ngAnimate', 'ui.grid']);

app.controller('MainCtrl', ['$scope', '$http', function ($scope, $http) {

  $scope.myData = [{name: "Brian", code: 50,count:20},
                 {name: "Jason", code: 43,userid:1},
                 {name: "Brian", code: 27,userid:10},
                 {name: "Devon", code: 29,userid:7},
                 {name: "Kale", code: 34,userid:2}];

  $scope.gridOptions = {
    enableSorting: true,
    data:'myData',
    columnDefs: [
      { field: 'name', displayName: 'Name'},
      {field: 'code', displayName: 'Code'},
      { field: 'userid', displayName: 'UserId'
        }
      }
    ]
  };
}]);

how can i accomplish that? Thank you in advance...

Upvotes: 1

Views: 1788

Answers (2)

Pankaj Parkar
Pankaj Parkar

Reputation: 136134

One of the work around would be, Instead of passing myData do filter you criteria and then assign that filtered data to new scope variable and assign that inside your gridOptions data field

Code

$scope.filteredData = myData; //make filter your data manually here 

$scope.gridOptions = {
    enableSorting: true,
    data:'filteredData', //passed filtered data here.
    columnDefs: [
      { field: 'name', displayName: 'Name'},
      {field: 'code', displayName: 'Code'},
      { field: 'userid', displayName: 'UserId'
        }
      }
    ]
};

Upvotes: 1

cbender
cbender

Reputation: 2251

You need to use a filter. You can read about the standard angular filter here. You can read about how to make custom filters here.

Upvotes: 1

Related Questions