I'm looking for a good example of having a basic filter and having a custom template. I'm having trouble finding a good example on the tutorial sites. See attached plunk where I'm setting filtering and having a custom header template. Does the filtering need to be embedded into the header template?
http://plnkr.co/edit/VMETPu30iiFc3GYmZZRS?p=preview
var app = angular.module('app', ['ngAnimate', 'ui.grid']);
app.controller('MainCtrl', ['$scope', '$http', function ($scope, $http) {
$scope.columns = [{ field: 'name', headerCellTemplate: '<div class="grand-total">Name</div>' }, { field: 'gender' }];
$scope.gridOptions = {
enableSorting: true,
columnDefs: $scope.columns,
enableFiltering: true
};
$scope.remove = function() {
$scope.columns.splice($scope.columns.length-1, 1);
}
$scope.add = function() {
$scope.columns.push({ field: 'company', enableSorting: false });
}
$scope.splice = function() {
$scope.columns.splice(1, 0, { field: 'company', enableSorting: false });
}
$scope.change = function() {
$scope.columns = [{ field: 'First', }, { field: 'Second' }, { field: 'third' }];
$scope.gridOptions.columnDefs = $scope.columns;
}
$scope.unsplice = function() {
$scope.columns.splice(1, 1);
}
$http.get('https://rawgit.com/angular-ui/ui-grid.info/gh-pages/data/100.json')
.success(function(data) {
$scope.gridOptions.data = data;
console.log(data)
});
}]);
Thanks in advance!