Date field localization issue

djmm68

I have a CRUD management application, which I've obtained using the DTE generator. One of the fields is of date type, which I want to give a specific format, with these elements:

• Moment.js (included in the whole DTE package by generator)
• Plugin datetime.js (written by Allan Jardine)
• Plugin datetime-moment.js (written by Allan Jardine)

In file 'table.mapi.js' (DTE generator), I add these lines

moment.locale('es'); // Chage locale to spanish
$.fn.dataTable.moment( 'ddd, D MMM YYYY', 'en' ); // Call function to give format to datetime field -- note that if I put 'es' on locale parameter, order doesn't work (some plugin compatibility issue?)

after $(document).ready(function() {

then, I define ('fields' param of var editor) the following:

"label": "Fecha:",
"name": "fecha",
"type": "datetime",
"def": function () { return new Date();},
"format": "ddd, D MMM YYYY",
"opts": { "showWeekNumber": false, "momentLocale": 'es' }

and

"data": "fecha",
"render": function ( data, type, full, meta ) { if (type === 'display') { if (data) { var mDate = moment(data); data = (mDate && mDate.isValid()) ? mDate.format("LL") : ""; } } return data; }

('columns' param of datatables), to get date displayed on large format.

Till now, all this works fine. The problem arrives on "New" record button's hand, when I fill in the fields (selecting desired date on datepicker) and then I press "Save" button, validator shows the following error:

"Date is not in the expected format", and, obviously, doesn't perform the op (save data to mysql db).

In addition, when I select one row, in order to edit its data, the modal edit form shows the fields; but date field is still on default locale ('en').

I suposse this is due to issues with format specified in date validator, since I've left the defaults created by DTE generator (except empty field validation, that's been customized), so:

Field::inst( 'fecha' )
->validator( function ( $val, $data, $opts ) { return empty( $val ) ? 'Este es un campo requerido' : true; } )
->validator( 'Validate::dateFormat', array( 'format'=>'D, j M Y' ) )
->getFormatter( 'Format::date_sql_to_format', 'D, j M Y' )
->setFormatter( 'Format::date_format_to_sql', 'D, j M Y' ),

What's the correct validation in this case? Do I need configure some kind of i18n on PHP settings in validation module, such as Moment 'locale'?

Thanks in advance

allan

Could you give me a link to the page in question please? Ideally with the es locale being set for the sorting information so I can take a look to see why that isn't working.

Thanks,
Allan

djmm68

Hi Allan, the link:

https://djmm.es/test/

I've prepared a test version, for a more comprensible read!

djmm68

Note: I've checked the link in some browsers, it's only works well on Google Chrome (the one I was using when I detected this issue).

On others browsers, the data field (label 'fecha', format 'LL') doesn't render properly, the browser shows a blank space on all cells of that column.

I think it has to do with i18n on browsers, but not completely sure.

allan

Sorry for the delay in getting back to you.

The data being returned by the server is in an English format such as Tue, 7 Feb 17. To have Moment correctly render that it would need to convert that string to a Date object than then render it out localised. It actually looks like, from the test case you kindly put together, that it is actually doing a good job of reading the date (which I'm slightly surprised about!) and then renders it back - although that, as you say might be related to the browser. Date.parse() on Chrome is very forgiving and will try just about everything to make the format given to it work. Other browsers are not so forgiving.

What you really want to do is have the server return the date in the format that you want to edit it. Ideally that would just be numbers since otherwise you would need to translate it at the server-side as well, which is possible, but obviously more work. If you have the date in the format you want to edit, the Editor aspect is easy - then you only need to render it in the DataTable.

Allan

djmm68

I think it's better if I use numeric dates on server-side. It's a purely aesthetic matter.
Thanks