Issue
I would like to set the value of a datetime-local input with the current date and time. Right now I have an ugly solution that involves slicing the first 17 characters. In addition it sets the time in GMT instead of the local time. My code is as follows:
<input type="datetime-local" name="name" id="1234">
<script type="text/javascript">
var d = new Date();
var elem = document.getElementById("1234");
elem.value = d.toISOString().slice(0,16);
</script>
I have two problems with this code:
- Is there a way to convert from a
Date
to a legal value without manually slicing the string? - I would like the string to be displayed in the datetime-local as
DD/MM/YYYY, hh:mm
(e.g.05/11/2015, 14:10
it is13:10
in GMT but I am in GMT+1 so I want to display14:10
). What is currently displayed is05/11/2015, 01:10 PM
. I would like to remove the PM and display in local time.
This might be an XY problem, so if I am doing it completely wrong and there is a better way to display datetime pickers in html, I would be happy to hear.
Solution
The toISOString
function is responsible of converting your local date (new Date
) into GMT.
If you don't want to use GMT then slice, you need to use the pure Date constructor and all of the getX functions, where X is (days, month, year...)
In addition, you'll need to extend the Number
object with a function that will help you to return 01
instead of 1
for example, to preserve the dd/mm/yyyy, hh/mm
format.
Let me call this prototype function AddZero
<input type="datetime-local" name="name" id="1234">
<script type="text/javascript">
Number.prototype.AddZero= function(b,c){
var l= (String(b|| 10).length - String(this).length)+1;
return l> 0? new Array(l).join(c|| '0')+this : this;
}//to add zero to less than 10,
var d = new Date(),
localDateTime= [(d.getMonth()+1).AddZero(),
d.getDate().AddZero(),
d.getFullYear()].join('/') +', ' +
[d.getHours().AddZero(),
d.getMinutes().AddZero()].join(':');
var elem=document.getElementById("1234");
elem.value = localDateTime;
</script>
Answered By - Bellash
0 comments:
Post a Comment
Note: Only a member of this blog may post a comment.