Date not formting right

[MatthewVParticipant]

I am trying to format the date from a JSON source and no matter what I try it still displays at the /Date(1452312998000)/ format. I have looked at the DataGrid API document and tried the following:

cellsformat: "d"
 cellsFormat: "d"
 cellsFormat: "MM/dd/yyyy"
 cellsformat: "mm/dd/yyyy"

What am I doing wrong?

Current Table code:

    $("#AlarmData").jqxDataTable({
        columns: [
            { dataField: "Description", Text: "Description" },
            { dataField: "DateRaised", text: "Date Raised", cellsformat: "d" },
            { dataField: "FullPath", text: "Path" }
        ],
        columnsResize: true,
        sortable: true,
        source: new $.jqx.dataAdapter({
            dateFileds: [
                { name: "FullPath", type: "string" },
                { name: "DateRaised", type: "date" },
                { name: "Description", type: "string" }
            ],
            dataType: "json",
            id: "ID",
            url: "LocationAlarms?locationID=" + $("#ID").val()
        }),
        width: 600
    });

JSON data from system:
[{"ID":4889,"FullPath":"All Clients \u003e\u003e Verizon \u003e\u003e All Networks \u003e\u003e Mountain \u003e\u003e Aurora 2 BDA\u0027s \u003e\u003e MTN CO1 C LAZY U (CUSTOMER OWNED) [REPEATER] \u003e\u003e Cell Repeater","DateRaised":"\/Date(1452312998000)\/","Description":"Connection Lost - Unable to Communicate with the device."}]

[ChristopherParticipant]

Hi MatthewV,

“/Date(1452312998000)/” isn’t a valid date so you can’t format it the way you want to. A valid date is the number between the breckets “1452312998000”. This is the time in miliseconds. So you have two options:
1) change the JSON file to return only that number and that’s all you have to do to resolve the issue.
2) Or Use cellsrenderer function on the column to convert the string “Date(1452312998000)” to a valid date. Here’s how to do it:
You can change the format of the date in the following line:
“var date = dataAdapter.formatDate(new Date(parseInt(newValue[0])), ‘d-M-yy’);”

Best Regards,
Christopher

jQWidgets Team
http://www.jqwidgets.com

[MatthewVParticipant]

Ok, what is the difference between that code/JSON and the below? The below table renders just fine with JSON that appears to have the exact same date.

[{"ID":52081,"ProjectCode":"CSSI0100009","ProjectDescription":"C Squared Company Overhead","TaskCode":"INTPROGRA","TaskDescription":"Internal Software Programming","StartDateTime":"\/Date(1477281600000)\/","HoursWorked":8.00,"WorkDescription":"Worked on MTN Alarm Report"}]

Table code:

    $("#TimeCardWeeklyOverview").jqxDataTable(
    {
        altRows: true,
        autoRowHeight: false,
        columns: [
            { dataField: "ProjectCode", text: "Project Code" },
            { dataField: "ProjectDescription", text: "Project Description" },
            { dataField: "TaskCode", text: "Task Code", width: 100 },
            { dataField: "TaskDescription", text: "Task Description" },
            { cellsformat: "dddd", dataField: "StartDateTime", text: "Day Worked", width: 100 },
            { dataField: "HoursWorked", text: "Hours Worked" },
            { dataField: "WorkDescription", text: "Work Description" }
        ],
        sortable: true,
        source: new $.jqx.dataAdapter({
            dataFields: [
                { name: "ProjectCode", type: "string" },
                { name: "ProjectDescription", type: "string" },
                { name: "TaskCode", type: "string" },
                { name: "TaskDescription", type: "string" },
                { name: "StartDateTime", type: "date" },
                { name: "HoursWorked", type: "number" },
                { name: "WorkDescription", type: "string" }
            ],
            dataType: "json",
            id: "ID",
            url: "/Timecard/TimeCardWeeklyOverview?selectedEmployeeID=" + $("#SelectedEmployeeID").val() + "&selectedDate=" + $("#SelectedDate").val()
        }),
        width: 900
    });

[ChristopherParticipant]

Hi MatthewV,

The difference is that in your first code sample you have a typo:

dateFileds: [
                { name: "FullPath", type: "string" },
                { name: "DateRaised", type: "date" },
                { name: "Description", type: "string" }
            ],

There’s no “dateFields” property. It’s called dataFields. That’s why the date wasn’t loaded properly. The jqxGrid wasnt recognizing that property and it uses it’s default one, which isn’t correct.

Best Regards,
Christopher

jQWidgets Team
http://www.jqwidgets.com

[Author]

Posts