Date Formatting not working - Angular, Vue, React, Web Components, Javascript, HTML5 Widgets

This topic contains 2 replies, has 2 voices, and was last updated by dchauhan 11 years, 4 months ago.

Viewing 3 posts - 1 through 3 (of 3 total)

Author

Date Formatting not working Posts

July 16, 2013 at 3:47 pm Date Formatting not working #25267

Participant

I have a java class that exectutes a stored procedure which returns a date. I have defined this date as string in my java class and then i prepare the json string as follows:

Java Class:
String updateDate=””;
updateDate=rs1.getString(“updateDate”);
reportList+=”{\”updateDate\”: \””+updateDate+”\”}”;

Below is the code that im trying to use to format the date. However anything i do doesnt format that date. It just displays the date as it was in the string:
Example) Here is the output of the reportList from the java class: {“updateDate”: “2013-07-15 00:00:00.0”}. This is what shows on the grid as well.

Javascript:
var ReportListDataSource =
{
datatype: “json”,
datafields: [
{name: ‘updateDate’, type: ‘date’,format: ‘yyyy-MM-ddTHH:mm:ss.fff’ },
],
id: ‘ReportListid’,
localdata: ReportListData
};

var ReportListSourceAdapter = new $.jqx.dataAdapter(ReportListDataSource);

$(tagName).jqxGrid({
width: 970,
height: 450,
source: ReportListSourceAdapter,
theme: ‘black’,
columns: [
{text: ‘Update Date’, dataField: ‘updateDate’, width: 200,cellsformat: ‘dddd, MMMM dd, yyyy’ },
]
//columns: ReportListColumnJson
});

July 16, 2013 at 3:56 pm Date Formatting not working #25269

Peter Stoev

Keymaster

Hi,

Here’s the correct code which will Format your Date:

<!DOCTYPE html>
<html lang="en">
<head>
    <link rel="stylesheet" href="../../jqwidgets/styles/jqx.base.css" type="text/css" />
    <script type="text/javascript" src="../../scripts/jquery-1.10.1.min.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxcore.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxdata.js"></script> 
    <script type="text/javascript" src="../../jqwidgets/jqxbuttons.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxscrollbar.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxmenu.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxgrid.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxgrid.selection.js"></script> 
    <script type="text/javascript" src="../../jqwidgets/jqxgrid.columnsresize.js"></script> 
    <script type="text/javascript" src="../../scripts/gettheme.js"></script>
    <script type="text/javascript">
        $(document).ready(function () {
    
            var ReportListDataSource =
            {
                datatype: "json",
                datafields: [
                {name: 'updateDate', type: 'date', format: 'yyyy-MM-dd HH:mm:ss.f' }],
                localdata: {"updateDate": "2013-07-15 00:00:00.0"}
            };
            var ReportListSourceAdapter = new $.jqx.dataAdapter(ReportListDataSource);
            $("#jqxgrid").jqxGrid({
                width: 970,
                height: 450,
                source: ReportListSourceAdapter,
                columns: [
                {text: 'Update Date', dataField: 'updateDate', width: 200,cellsformat: 'dddd, MMMM dd, yyyy' }
                ]
             });
        });
    </script>
</head>
<body class='default'>
    <div id='jqxWidget'>
        <div id="jqxgrid">
        </div>
    </div>
</body>
</html>

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com/

July 16, 2013 at 9:00 pm Date Formatting not working #25286

dchauhan

Participant

Great thank you.. that worked!

Author

Posts

Viewing 3 posts - 1 through 3 (of 3 total)

You must be logged in to reply to this topic.