Setting a column default value on angular ui grid

Question

I have a table with lots of columns and some rows may have undefined values so I want to show a default text instead of an empty cell depending on the column. How can I set that value?

I would expect something like this:

columnDefs: [
    {name: 'Code', field: 'code', default: 'My default value for code column'},
    {name: 'Name', field: 'name', default: 'My default value for name column'}
];

Thanks

There's an issue created, no answer yet.

lebolo
– lebolo

2016-04-04 22:52:10 +00:00
Commented Apr 4, 2016 at 22:52 — lebolo
– lebolo, Commented Apr 4, 2016 at 22:52

zx485 · Accepted Answer · 2017-03-06 22:37:19Z

2

Yeah you can use cellTemplate, look that, it's most easy:

columnDefs: [
  {name: 'Code', field: 'code', cellTemplate:'<div>{{row.entity.code="My default value for code column"}}</div>'},
  {name: 'Name', field: 'name', cellTemplate:'<div>{{row.entity.name="My default value for name column"}}</div>'}
];

edited Mar 6, 2017 at 22:37

zx485

29.1k28 gold badges55 silver badges65 bronze badges

answered Mar 6, 2017 at 22:13

geiner salcedo

313 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

mainguy · Accepted Answer · 2015-09-23 10:52:33Z

1

Use cellTemplates:

  var codeTemplate = '<div ng-if="row.entity.code">{{row.entity.code}}</div>' +
    '<div ng-if="!row.entity.code">My Default Value for code column</div>';

  var nameTemplate = '<div ng-if="row.entity.name">{{row.entity.name}}</div>' +
    '<div ng-if="!row.entity.name">My Default Value for name column</div>';

  $scope.gridOptions = {
    enableSorting: true,
    columnDefs: [{
      name: 'Code',
      field: 'code',
      cellTemplate: codeTemplate
    }, {
      name: 'Name',
      field: 'name',
      cellTemplate: nameTemplate
    }],
    data: [{
      "code": "122",
      "name": "Maximus"
    }, {
      "code": "123",
      "name": "Minimus"
    }, {
      "code": null,
      "name": "Nocodeus"
    }, {
      "code": '',
      "name": "Emptyus"
    }, {
      "code": '124',
      "name": ""
    }, {
      "code": '',
      "name": ""
    }]
  };

Example is here

answered Sep 23, 2015 at 10:52

mainguy

8,3312 gold badges34 silver badges40 bronze badges

1 Comment

chank Over a year ago

This solution would work. However, the columns with custom "cellTemplate" having issues with filtering. It doesn't work or returns partial results

Ravi · Accepted Answer · 2019-10-02 15:02:24Z

1

I achieved it through applying expression to valueFormatter

    columnDefs: [
        {name: 'Code', field: 'code', valueFormatter: 'value || My default value for code column'},
        {name: 'Name', field: 'name', valueFormatter: 'value || My default value for name column'}
    ];

I think it can also be achieved by applying expression to valueGetter

answered Oct 2, 2019 at 15:02

Ravi

2,5883 gold badges27 silver badges33 bronze badges

Collectives™ on Stack Overflow

Setting a column default value on angular ui grid

3 Answers 3

Comments

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related