Can we have a single cell as Datepicker or a dropdown?

Question

Am using AngularJS UI-Grid. Have a constant grid with 6 columns and 4 rows. In this grid i have a specific requirement where only one cell is a date picker, one cell is a dropdown, and few cells are number only. I know that for the entire column this can be applied. Is there a way to apply this for a particular cells individually?

Any sample would be of great help.

Thanks in advance.

score 0 · Answer 1 · answered Nov 10 '15 at 14:24

one option is to use a template that decides what kind of cell its going to be in relation to some row-entity-property.

I created a Plunkr showcasing such a scenario.

The setup consists of a cellTemplate:

cellTemplate: "<button ng-if=\"!row.entity.datepicker\" ng-click=\"grid.appScope.delete(row)\">DELETE ROW</button><input type=\"date\" ng-if=\"row.entity.datepicker\">"

And for this example I created a datepicker:true/false property in my row-data.

for(var i = 0; i < 3; i++) {
  editor.mySeasons.push({myDate: new Date(new Date().getTime() + Math.random().toFixed(12) * 100000000000), datepicker: false});
}
editor.mySeasons.push({myDate: new Date(new Date().getTime() + Math.random().toFixed(12) * 100000000000), datepicker: true});

Hope that helps.

Can we have a single cell as Datepicker or a dropdown?

1 Answers1