Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Angular ui grid is filtering by string when columnDefs has field as type number. Why?

I'm using django 1.8, and angularjs 1.3.14, and jquery 1.11.0.

This is in the Controller/gridOptions/columnDefs.

{ field: 'credit_amt',                
  displayName: 'Credit Amount',           
  type: 'number', 
  width: '8%',   
  enableFocusedCellEdit: true, 
  visible:true,
  //This 'filters' is the sort box to do the search.
  filters: [{   
            condition: uiGridConstants.filter.GREATER_THAN,
            placeholder: 'greater than'
          }

Notice that 'type' is a number. When I run this the program treats this field as a String and not a number. So the sort doesn't work the way I need it to.
I've tried leaving out 'type' and having it auto detect the data type. -didn't work.

Here's what the sort looks like before and after use:

Before adding search items

Simply adding a 6 to the search field

As you can see, items were filtered when none of the data was smaller than 6. Please help. Thank you.

like image 812
Jon Kennedy Avatar asked Jul 10 '15 15:07

Jon Kennedy


Video Answer


2 Answers

You can use your own condition function

condition: function(term, value, row, column){
   if(!term) return true;
   return parseFloat(value) > parseFloat(term);
}
like image 53
Qi Tang Avatar answered Nov 15 '22 04:11

Qi Tang


What version of angular-ui-grid are you using. I just made a plnkr with the similar data with sorting and filtering and it worked ok. So it could be a version issue on your end.

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

app.controller('MainCtrl', ['$scope', '$http', 'uiGridConstants', function ($scope, $http, uiGridConstants) {
  $scope.gridOptions1 = {
    enableSorting: true,
    enableFiltering:true,
    columnDefs: [
      { field: 'credit_amount',                
  displayName: 'Credit Amount',           
  type: 'number', 
  enableFocusedCellEdit: true, 
  visible:true,
  //This 'filters' is the sort box to do the search.
  filters: [{   
            condition: uiGridConstants.filter.GREATER_THAN,
            placeholder: 'greater than'
          }
    ]

      }]
  };

 $scope.gridOptions1.data = [{
   credit_amount:1000.02
 },{
   credit_amount:1001.0
 },{
   credit_amount:100.0
 },{
   credit_amount:500.0
 }]
}]);

http://plnkr.co/edit/ZQK1obRbctCUhUDrdoY2?p=preview

like image 30
Kathir Avatar answered Nov 15 '22 05:11

Kathir