I want a date picker in my cell so i have created a cell template
var myDateTemplate= '<input type="text" ng-model="row.entity.myDate" />';
my col model is
var col = [{
field : 'myDate',
displayName : 'My Date',
enableCellEdit : true,
width : '130',
cellTemplate : myDateTemplate,
editableCellTemplate : myDateTemplate,
resizable : true,
sortable : false
}]
it works fine and when i choose date i get it in mm/dd/yyyy format i want to change it to dd/mm/yyyy format to i added ui date format
var myDateTemplate = '<input ui-date="{ dateFormat: 'dd mm yyyy' }" ui-date-format="dd mm yyyy" ng-model="row.entity.myDate"/>';
when i use ui date format it will throw a error
Error: Syntax Error: Token 'undefined' not a primary expression at column NaN of the expression [{ dateFormat:] starting at [{ dateFormat:]
and it is giving the date like
Mon Dec 23 2013 00:00:00 GMT+0530 (India Standard Time) instead of my preffered format.
The answer is that value formatter's are for text formatting and cell renderer's are for when you want to include HTML markup and potentially functionality to the cell. So for example, if you want to put punctuation into a value, use a value formatter, but if you want to put buttons or HTML links use a cell renderer.
HTML in Cells This time, to achieve it we use a cell renderer. By default ag-grid will create the cell values using simple text, cell renderers allow us to add more complex HTML inside the cells.
I think you're close, just escape the quotes around your date format to make the proper string:
var myDateTemplate = '<input ui-date="{ dateFormat: \'dd mm yyyy\' }" ui-date-format="dd mm yyyy" ng-model="row.entity.myDate"/>';
I'm not using the exact same cellTemplate you are (presumably your input field will work correctly once you escape the quotes). This is working for me:
columnDefs: [{
field:'StartTime',
displayName:'Start Time',
cellFilter: 'date:\'MM/dd/yyyy HH:MM:ss\''
}, {
field:'duration', displayName:'Duration'
}, {
field:'distance', displayName:'Distance'
}, {
field:'typedesc', displayName:'Type'
}, {
field:'Drivers', displayName:'Drivers'
}]
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With