editor - display mmm dd yyyy not millisecond date

dpanscik

I was wondering if there was a datatable javascript way of solving this problem.

I want to display a human readable date, not javascript epoch datetime.

Ive solved this problem in the past by either using the dataTable date picker (OR) in C# on the server side converting the date field to a string that has the proper formatting.

Is there a better way to do this date conversion in editor using the editor API and javascript?

I tried this example;
https://editor.datatables.net/examples/dates/formatting-client.html

But as soon as i put the following into editor

            type: 'datetime',
            def: () => new Date(),
            displayFormat: 'M/D/YYYY',
            wireFormat: 'YYYY-MM-DD',

the millisecond date dissapears in editorand nothing comes back

here is my code

            {
                "label": "Patient DOB:",
                "name": "Patient_DOB",
                type: 'datetime',
                def: () => new Date(),
                displayFormat: 'M/D/YYYY',
                wireFormat: 'YYYY-MM-DD',
                fieldInfo: 'm/d/y (or) month-name day year',                

            },

dpanscik

I realized the ''type': 'datetime'' gets the picker going, which I do not want. I just want a readable date format,

Code Sample #1

            {
                "label": "Patient DOB:",
                "name": "Patient_DOB",
                //def: () => new Date(),
                ///displayFormat: 'M/D/YYYY',
                //wireFormat: 'YYYY-MM-DD',
                fieldInfo: 'm/d/y (or) month-name day year',                

            },

Here is editor with Code Sample #1

Here is code sample #2

            {
                "label": "Patient DOB:",
                "name": "Patient_DOB",
                def: () => new Date(),
                displayFormat: 'M/D/YYYY',
                wireFormat: 'YYYY-MM-DD',
                fieldInfo: 'm/d/y (or) month-name day year',                

            },

Here is editor with Code Sample #2 (no change).

I solve the date formatting issue in normal plain datatable by using the following;

render: function (data, type, row, meta) { return moment.utc(data).local().format('MMMM D YYYY'); },

But editor sill shows the date in milliseconds.

dpanscik

I also tried the following in editor, with no change

            {
                "label": "Patient DOB:",
                "name": "Patient_DOB",
                //type: "datetime",
                //format: "ddd, DD MMM YYYY",
                //def: () => new Date(),
                //displayFormat: 'M/D/YYYY',
                //wireFormat: 'YYYY-MM-DD',
                render: function (data, type, row, meta) { return moment.utc(data).local().format('MMMM D YYYY'); },
                //type: "datetime",
                //format: 'DD/MM/YYYY HH:mm',
                fieldInfo: 'm/d/y (or) month-name day year',                

            },

dpanscik

Here is the dataTransport in the browser

Here is the data leaving the controller

Something is switching the date to millisecond date, it certainly isnt leaving the controller as millisecond date

dpanscik

The same issue was here...

https://datatables.net/forums/discussion/39809/how-to-format-date-returned-from-net-ajax-call

But I am trying to solve this client side. Not server side. Changing the db field from DateTime to String isnt an option in this situation.

dpanscik

Here is my latest attempt to correct the editor display the date as /Date(-2208960000000)/

This approach does not work using moment and render funciton, although in the exact same table, the datatable this procedure does indeed work, it just dosent work in editor.

            render: function (data, type, row, meta) { return moment.utc(data).local().format('MMMM D YYYY'); },
            fieldInfo: 'm/d/y (or) month-name day year',   

    var editor = new DataTable.Editor({
        ajax: '/AlternativeBilling002/DataTransport',
        table: '#GR_AlternativeBilling',
        fields: [
            {
                "label": "Scheduled",
                "name": "Scheduled",
                type: 'checkbox',
                separator: '|',
                options: [{ label: '', value: 1 }]
            },
            {
                "label": "Patient Name (LAST, FIRST)",
                "name": "PatientName"
            },
            {
                "label": "Patient Phone:",
                "name": "PatientPhone"
            },
            {
                "label": "Patient DOB:",
                "name": "Patient_DOB",
                "data": "Patient_DOB",
                render: function (data, type, row, meta) { return moment.utc(data).local().format('MMMM D YYYY'); },
                fieldInfo: 'm/d/y (or) month-name day year',                

            },

dpanscik

i finally solved it by grabbing the AJAX return and doing a conversion.

        ajax: {
            "url": "/AlternativeBilling002/DataTransport",
            "type": "POST",
            "datatype": "json",
            "dataSrc": function (json) {
                console.log(json);
                for (var i = 0, ien = json.data.length; i < ien; i++) {
                    json.data[i].Patient_DOB = moment.utc(json.data[i].Patient_DOB).local().format('MMMM D YYYY');
                }
                return json.data;

            },


        },

allan

Nice little monologue... Sorry I wasn't able to reply back earlier (been a busy few days here!).

What you've done is a good way of handling it.

The DateTime library does not support .NET dates out of the box (its a .NET date which has its epoch starting 1 January 1601, rather than Javascript which is 1 Janurary 1970).

The other option would be to have the server return ISO8061 rather than a .NET date. Personally I prefer ISO8061 over the wire, but either approach will work.

Allan