Open swapnil-patil-27687 opened 5 years ago
For your reference please reefer the this plunker http://embed.plnkr.co/UzoEgHg4G2rNlutklx4K/
Like the "Age" column custom filter in above plunker we are using custom filter for "usernames" and other columns. Some column having the values like as follows
swapnil patil Tushar Neve Sachin Patil (Pune) Hitesh Patil (Mumbai)
When we filter for values like "Hitesh Patil (Mumbai)" in ng-grid dosent show any data.
Please help us on to resolve the issue.
for more understanding issue please paste below code in above plunker "app.js" file
`var app = angular.module('app', ['ngAnimate', 'ngTouch', 'ui.grid', 'ui.grid.selection']);
app.controller('MainCtrl', ['$scope', '$http', 'uiGridConstants', function ($scope, $http, uiGridConstants) { var today = new Date(); var nextWeek = new Date(); nextWeek.setDate(nextWeek.getDate() + 7);
$scope.gridOptions = { enableFiltering: true, onRegisterApi: function(gridApi){ $scope.gridApi = gridApi; }, columnDefs: [ { field: 'name' }, { field: 'gender', //filterHeaderTemplate: '
$http.get('https://cdn.rawgit.com/angular-ui/ui-grid.info/gh-pages/data/500_complex.json') .success(function(data) { $scope.gridOptions.data = data; $scope.gridOptions.data[0].company = '(swap) patil';
data.forEach( function addDates( row, index ){
row.mixedDate = new Date();
row.mixedDate.setDate(today.getDate() + ( index % 14 ) );
row.gender = row.gender==='male' ? '1' : '2';
});
});
}])
.filter('mapGender', function() { var genderHash = { 1: 'male', 2: 'female' };
return function(input) { if (!input){ return ''; } else { return genderHash[input]; } }; })
.directive('myCustomDropdown', function() { return { template: '' }; })
.controller('myCustomModalCtrl', function( $scope, $compile, $timeout ) { var $elm;
$scope.showAgeModal = function() { $scope.listOfAges = [];
$scope.col.grid.appScope.gridOptions.data.forEach( function ( row ) {
if ( $scope.listOfAges.indexOf( row.company ) === -1 ) {
$scope.listOfAges.push( row.company );
}
});
$scope.listOfAges.sort();
$scope.gridOptions = {
data: [],
enableColumnMenus: false,
onRegisterApi: function( gridApi) {
$scope.gridApi = gridApi;
if ( $scope.colFilter && $scope.colFilter.listTerm ){
$timeout(function() {
$scope.colFilter.listTerm.forEach( function( company ) {
var entities = $scope.gridOptions.data.filter( function( row ) {
return row.company === company;
});
if( entities.length > 0 ) {
$scope.gridApi.selection.selectRow(entities[0]);
}
});
});
}
}
};
$scope.listOfAges.forEach(function( company ) {
$scope.gridOptions.data.push({company: company});
});
var html = '<div class="modal" ng-style="{display: \'block\'}"><div class="modal-dialog"><div class="modal-content"><div class="modal-header">Filter Ages</div><div class="modal-body"><div id="grid1" ui-grid="gridOptions" ui-grid-selection class="modalGrid"></div></div><div class="modal-footer"><button id="buttonClose" class="btn btn-primary" ng-click="close()">Filter</button></div></div></div></div>';
$elm = angular.element(html);
angular.element(document.body).prepend($elm);
$compile($elm)($scope);
};
$scope.close = function() { var ages = $scope.gridApi.selection.getSelectedRows(); $scope.colFilter.listTerm = [];
ages.forEach( function( company ) {
$scope.colFilter.listTerm.push( company.company );
});
$scope.colFilter.term = $scope.colFilter.listTerm.join(', ');
$scope.colFilter.condition = new RegExp($scope.colFilter.listTerm.join('|'));
if ($elm) {
$elm.remove();
}
}; })
.directive('myCustomModal', function() { return { template: '', controller: 'myCustomModalCtrl' }; }) ; `
For more help please revert back.
Thanks and Regards, Swapnil Patil
Please make sure each of the following is true before submitting a new issue. We are a small team with limited time and it is very difficult to manage issues if they aren't reported correctly.
Use Stack Overflow or Gitter for questions.