JavaScript date and time formatting, - javascript

I have read a lot of thread about the subject, but i'm not much into programming... i've made some tests but never acheive what i wanted.
Here we have a html template we have to modify to suit our needs.
here the code i have to edit:
<p id="DATE"></p>
<script>
var d = new Date();
document.getElementById("DATE").innerHTML = d.toString();
</script>
Its giving me the date OK...but not i the format i want...
the format i want is... DD-MM-YYYY HH:MM
Simple has that :)
Its been a couple of hours and i can't do it... Can anyone help with a code i just can copy/paste in my html file.

As opposed to using an external JavaScript library for a simple task. You should be able to achieve the same with Vanilla js.
Refer to this:
Where can I find documentation on formatting a date in JavaScript?
In short:
var d = new Date();
var curr_date = d.getDate();
var curr_month = d.getMonth() + 1; //Months are zero based
var curr_year = d.getFullYear();
var curr_hour = d.getHours();
var curr_min = d.getMinutes();
console.log(curr_date + "-" + curr_month + "-" + curr_year + " " + curr_hour + ":" + curr_min);
The above snippet should have all the code you need.
For your specific implementation, you will need to do the below:
<script>
var d = new Date();
var curr_date = d.getDate();
var curr_month = d.getMonth() + 1; //Months are zero based
var curr_year = d.getFullYear();
var curr_hour = d.getHours();
var curr_min = d.getMinutes();
var formattedDate = curr_date + "-" + curr_month + "-" + curr_year + " " + curr_hour + ":" + curr_min;
document.getElementById("DATE").innerHTML = formattedDate;
</script>

A function for the format you require is fairly simple. The following will return a string for a provided Date, or the current date if none passed.
function formatDate(date) {
var d = date || new Date();
function z(n){return (n<10?'0':'')+n}
return z(d.getDate()) + '-' +
z(d.getMonth()+1) + '-' +
d.getFullYear() + ' ' +
z(d.getHours()) + ':' +
z(d.getMinutes());
}
document.write(formatDate());
BTW, you can't use the same token for two separate parts. While there is no standard or even consistency for formatting tokens, your format would be more commonly expressed as:
DD-MM-YYYY HH:mm
Which is compatible with moment.js and a few others, though there are many other token sets to represent the same format.

To achieve your goal simply try following codes:
First of all, inside the head tag add the below line of code:
<script src="https://rawgit.com/moment/moment/2.2.1/min/moment.min.js"></script>
Finally, change your existing line of code:
document.getElementById("DATE").innerHTML = moment(d).format('DD-MM-YYYY HH:MM');
Happy coding :)

Related

How to format existing date using JavaScript/jQuery

I am trying to format date time using JavaScript/jQuery but it's not happening. My code is below.
<div id="divID"></div>
<script>
var formatDate = function(date){
return date.getDate() + "/" + date.getMonth() + "/" +date.getYear() + " "+ date.getHours() + ":" + date.getMinutes() + ":" + date.getMintutes() + ":" + date.getSeconds();
}
var timestamp="2016-12-16 07:58:30 AM ";
var date= new Date(timestamp);
document.getElementById('divID').innerHTML = formatDate(date);
</script>
Here I have the existing time 2016-12-16 07:58:30 AM and I need change it to 16-12-2016 07:58:30 AM but here I could not get the proper output.
Your code has a few issues:
You have a syntax error, you're calling getMintutes()
You appear to be attempting to show the minutes twice, so you can remove one of those calls
getFullYear() fits your needs better than getYear()
You should use - not / to delimit the date values.
You can add AM or PM to the end of the string by checking if hours < 12
Your timestamp string isn't valid. It should not contain 'AM' or 'PM' - hence why the code doesn't work in Firefox.
With that in mind, try this:
var formatDate = function(date) {
return date.getDate() + "-" + date.getMonth() + "-" + date.getFullYear() + " " + ('0' + date.getHours()).slice(-2) + ":" + ('0' + date.getMinutes()).slice(-2) + ":" + ('0' + date.getSeconds()).slice(-2) + ' ' + (date.getHours() < 12 ? 'AM' : 'PM');
}
var timestamp = "2016-12-16 07:58:30";
var date = new Date(timestamp);
document.getElementById('divID').innerHTML = formatDate(date);
<div id="divID"></div>
You could use a library to make the date formatting logic simpler, but it's rather wasteful to load an entirely library when a single line of code works fine.
The timestamp you are using will return an invalid date so you should remove the AM. Using moment.js you can do it like this:
var timestamp = "2016-12-16 07:58:30";
var formattedDate = moment(timestamp).format('DD-MM-YYYY h:mm:ss A');
console.log(formattedDate);
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.5.1/moment.min.js"></script>
you can use a library named moment.js http://momentjs.com/
var date = new Date();
moment(date).format('DD-MM-YYYY HH:mm:ss A')
jQuery dateFormat is a separate plugin. You need to load that explicitly using a <script> tag.
You can use JQuery UI Datepicker for getting the formatted date like the following.
let myDate = '2020-11-10';
$.datepicker.formatDate('dd-M-yy', new Date(myDate));
The above code will return 10-Nov-2020.
You can get the desired output using JQuery UI Datepicker Widget as shown below.
var timestamp="2016-12-16 07:58:30 AM ";
var desiredTimestamp = $.datepicker.formatDate('dd-mm-yy', new Date(timestamp.split(' ')[0])) + ' ' + timestamp.split(' ')[1] + ' ' + timestamp.split(' ')[2];

Convert date format from JSON in AJAX success function

I am getting the date format in JSON respose like below
14-JAN-14
I need to convert it in my ajax success function like below
2014-01-14
How can I do this? Thanks
Here's how to do it in JS:
var d = new Date('14-Jan-14');
var curr_date = d.getDate();
var curr_month = ("0" + (d.getMonth() + 1)).slice(-2);
var curr_year = d.getFullYear();
document.write(curr_year + "-" + curr_month + "-" + curr_date);
I've added in the add a zero and slice the last two characters so that you have your double digit date month format too.
Here's the fiddle.

Shorter way to write this JavaScript date code

Hello I want to get today's date in JavaScript in the following format: dd/mm/YYYY
The following code does the job but surely there is a shorter way to write this?
var today = new Date();
var day = today.getDate();
var month = today.getMonth()+1;
var year = today.getFullYear();
var todaysDate = day + "/" + month + "/" + year;
Thanks in advance.
recommend a great js date/time lib: http://momentjs.com/
moment().format('D/M/YYYY'); //"10/2/2013"
if you need padding zeros:
moment().format('DD/MM/YYYY'); //"10/02/2013"
if you want write pure js, nothing much can do here, just cut off some variable.
var today = new Date;
//parenthesis around month is required.
var todaysDate = today.getDate() + '/' + (today.getMonth()+1) + '/' + today.getFullYear();
//"10/2/2013"
Of course.
var date = new Date();
var todaysDate = date.getDate() + "/" + date.getMonth()+1 + "/" + date.getFullYear();
Note that this will return values without leading zeros. You can add them using one extra function for convenience:
function checkTime(i){if(i<10){i="0" + i}return i}
var date = new Date();
var todaysDate = checkTime(date.getDate()) + "/" + checkTime(date.getMonth()+1) + "/" + date.getFullYear();
Although JavaScript provides a bunch of methods for getting and setting parts of a date object, it lacks a simple way to format dates and times according to a user-specified mask. Yours is quite simple enough.
You could use an external library, but the script size trade-off won't be optimal for just one simple operation.
A shorter version would be to combine the last 4 lines inline this way:
var today = new Date();
var todaysDate = today.getDate() + "/" + (today.getMonth()+1) + "/" + today.getFullYear();

javascript date with string

I'm trying to convert a date in javascript from MM/dd/yyyy to yyyy/MM/dd
so this works:
var d = new Date("08/08/2012");
dateString = d.getFullYear() + "/" + d.getMonth() + "/" + d.getDate();
document.write(dateString);
output = 2012/7/8
///////////////////////////////////////////////////
this does not:
var dateString = "08/08/2012";
var d = new Date(dateString);
dateString = d.getFullYear() + "/" + d.getMonth() + "/" + d.getDate();
document.write(dateString);
and neither does this:
var dateString = "08/08/2012";
var d = Date.parse(dateString);
dateString = d.getFullYear() + "/" + d.getMonth() + "/" + d.getDate();
document.write(dateString);
how do I make it work with a string variable? thanks
~Myy
var dateString = "08/08/2012";
var d = new Date(dateString);
dateString = d.getFullYear() + "/" + d.getMonth() + "/" + d.getDate();
document.write(dateString);
That should, and does, work. Keep in mind that JavaScript stores months as a zero-indexed value.
If you want to have leading zeros, then you'll have to do some magic:
var dateString = "08/08/2012";
var d = new Date(dateString);
dateString = d.getFullYear() + "/" + ('0' + (d.getMonth()+1)).slice(-2) + "/" + ('0' + d.getDate()).slice(-2);
document.write(dateString);​
jsFiddle
The reason why your Date.parse( ) example is not working, is because that function returns a timestamp (number of milliseconds since 1970), instead of a Date object. Therefore, you can't call functions like getFullYear() on the timestamp.
If all you need to do is re-order the values, you can do:
var dateString = "08/08/2012";
var dateElements = dateString.split("/");
var outputDateString = dateElements[2] + "/" + dateElements[0] + "/" + dateElements[1];
document.write(outputDateString );
I can confirm with MrSlayer that the code works in jsFiddle.
Your attempts at using Date.parse() should actuall be using Date(String(dateString)).
Don't forget to add 1 for each month.

How to split the date , time using javascript?

How to split the date,time using java script ? I am getting date,time 2010-05-04 20:13:12.0.But i need only date.
date format mm/dd/yyyy
var cdate = gridline[i=1]["CDATE"];
Now i need cdate as mm/dd/yyyy only.
Please help me.
function getDateFromString(datestring) {
var d = new Date(datestring);
var curr_date = d.getDate();
var curr_month = d.getMonth();
curr_month++;
var curr_year = d.getFullYear();
return curr_date + "-" + curr_month + "-" + curr_year;
}
Source: webdevelopersnotes.com

Categories

Resources