Format JSON Date String To Local DataTime Object Using JavaScript
Now here in this tutorial, I’ll explain how to format JSON date string and convert into a valid local datatime object using JavaScript with example code.
In my previous tutorials, I’d explainedpreview image before upload using jquery,how to set dropdownlist selected value using javascript,how to disable submit button once form submitted and other more cracking tutorials onAsp.net,JavaScript,jQuery here.
Sometimes it’s necessary to convert the returned JSON date string into a valid javascript object and display within a webpage. If you’re looking for the same, simply follow this tutorial.
If you’ve JSON date something like/Date(1414151600000)/, you most likely wants to convert it into a valid date to perform your other operations.
Format JSON Date String Using JavaScript Function
Following is the function that will help us to convert JSON string into date time object:
function formatJSONDate(jsonDate) {
var newDate =new Date(parseInt(jsonDate.substr(6)));
return newDate = newDate.toLocaleFormat(‘%d-%b-%Y’);
}
</script>
Call it as:
alert(formatJSONDate(jsonDate));
In the above example, thesubstr function takes out the/Date( part and theparseInt function gets the integer and ignores the)/ at the end. The final resulting number is passed into theDate constructor.
HTML Markup – [.aspx]
Following is the complete HTML markup code that I’ve used for this demonstration to format json date:
<headid=”Head1″runat=”server”>
<title>Format JSON Date String To Valid Local DataTime Object</title>
<scripttype=”text/javascript”>
var jsonDate =“/Date(1414151600000)/”;
alert(formatJSONDate(jsonDate));
function formatJSONDate(jsonDate) {
var newDate =new Date(parseInt(jsonDate.substr(6)));
return newDate = newDate.toLocaleFormat(‘%d-%b-%Y’);
}
</script>
</head>
<body>
<formid=”form1″runat=”server”>
</form>
</body>
</html>
Note: If you are already using jQuery UI Datepicker Widget in your project you can do it by following simple way:
<scriptsrc=”//code.jquery.com/ui/1.11.4/jquery-ui.js”></script>
<scripttype=”text/javascript”>
var jsonDate =“/Date(1414151600000)/”;
var newDate = $.datepicker.formatDate(“d MM, yy”,new Date(parseInt(jsonDate.substr(6))));
alert(newDate);
</script>
