1

Can anyone provide a practical example? From my understanding, field refers to the actual field you want to reference. That is, field should be the name of the variable (in the code) that you want to put in the table. displayName is more clear: it just specifies how the column name will be displayed in the table. This seems to be everything you need. What is the purpose of "name" then?

Here is the documentation for reference: http://ui-grid.info/docs/#/api/ui.grid.class:GridOptions.columnDef

element_j
  • 103
  • 1
  • 1
  • 15

1 Answers1

0

I will explain the answer by comparing name, field and display name properties of gridOptions.columnDefs. When adding columns to the grid, you cannot give two different columns same name, so duplicate name is not allowed. Eg: $scope.gridOptions.columnDefs = [ { name:'customName',field: 'id',displayName :'name2'}, { name: 'customName',field: 'name',displayName :'name2' }, { name: 'age', displayName: 'Age (not focusable)', allowCellFocus : true }, ]; Since there are same columns with name:'customName', this is not allowed, one of those columns won't be displayed. But as you can see, displaynames can be the same. You do not always define displayName, if you have a name property only, name propert will be served as an display name for your column.

When it comes to field property, it is like "id" attribute of a html element. 
E.g:
 $scope.singleFilter = function( renderableRows ){
var matcher = new RegExp($scope.filterValue);
renderableRows.forEach( function( row ) {
  var match = false;
  [ 'name' ].forEach(function( field ){
    if ( row.entity[field].match(matcher)){
      match = true;
    }
  });
  console.log($scope.filterValueAge);
  if (match && $scope.filterValueAge !== undefined)
  {
    console.log($scope.filterValueAge === '');
    console.log(row.entity['age'] === $scope.filterValueAge);
    if (row.entity['age'] === $scope.filterValueAge){
      console.log('found age match');
      match = true;
    }
    else
    {
      match = false
    }
  }

  if (!match)
  {
    row.visible = false;
  }
});
return renderableRows;

};

As you can see in this example, you can get the value of a row by row.entity[field] this expression.

You may try this by yourself, check out this plunk => http://embed.plnkr.co/plunk/boX0e6

PurpleGreen
  • 39
  • 8