I wish to display the date with the format like this "dd/MM/yyyy" instead of "MM.dd.yyyy", is there any way to do it for edit fileld with the type "date"?
You could use the 'render' props on columns =>
{
field: 'validated_at',
title: 'Hi'
type: 'date',
render: rowData => moment(rowData.validated_at).format('DD/MM/YYYY')
}
I think the question was for editable field, the above is applying the format for data after being saved or when loaded.
To provide a format on edit field, the only way I figured was to use "editComponent" column property like this:
{
title: "Date",
field: "date",
type: "date",
editComponent: props => (
<MuiPickersUtilsProvider utils={DateFnsUtils}
locale={props.dateTimePickerLocalization}>
<DatePicker
format="dd/MM/yyyy"
value={props.value || null}
onChange={props.onChange}
clearable
InputProps={{
style: {
fontSize: 13,
}
}}
/>
</MuiPickersUtilsProvider>
)
},
Basically, I added the code from m-table-edit-field.js into the "editComponent" and I changed the format.
This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions. You can reopen it if it required.
Most helpful comment
You could use the 'render' props on columns =>