Date Picker for Angular that Ignores Local Timezone - javascript

Is there any date picker that just displays what is supplied to it and ignores the local timezone?
We're currently using angular-strap's date picker and the data-min-date changes when the local time zone of the computer is changed. The supplied data-min-date is just a fixed date but somehow the date picker is affected by the local time zone.
Example:
Supplied Date: 2016-12-23T16:33:03+08:00 ISO8601 Format
On UTC-12:00 22-December-2016 is disabled so the minimum is 23-December-2016.
On UTC+08:00 23-December-2016 is disabled so the minimum is 24-December-2016.
Not sure which one is the expected date, but the expected outcome should be that there will be no changes since a fixed date is supplied.
Is there anything I am missing or any other calendar that will just display what is given to it?
EDIT 1: Is it a legit way to test date functionalities by changing the local timezone of a computer? Is it the same or different than when you are locally or naturally situated in that timezone?
EDIT 2: We already generated datetime from our node server using momentjs. var serverTime = moment().utcOffset(8); it's just the the angular-strap handles the date we supplied in an odd way.
EDIT 3: Adding an attribute data-timezone="utc" doesn't help either.
EDIT 4: We've discovered that the plug-in uses date = new Date(value); in which value is the date that we passed. And it returns something like Thu Dec 22 2016 21:29:54 GMT-1200 (Local Standard Time) which clearly uses the local timezone. And there is no condition to check if there is timezone="utc" supplied. We also tried to directly assign date = Thu Dec 22 2016 21:29:54 GMT-1200 (Local Standard Time) but the plug-in breaks.

We did a hack around. We forked the plug in and changed the code that handles the min-date.
Change history can be found here. Snippet we added:
var a = new Date(value); // value - date we are passing
var b = a.getTime() + (a.getTimezoneOffset() * 60000); // no idea what this is
date = new Date(b + (3600000*(8))); // the 8 is the timezone we want
The problem with the new Date(value) is that it is affected by the local timezone.

Related

Moment.js formats locally until I specify the format

I need to set a datetime-local picker's default value to the current local time. Native JS seems to output in local time by default:
new Date($.now()); // "Sat Nov 12 2016 22:36:52 GMT+1100 (AEDT)"
However functions like toISOString() output in UTC, and although I can pull out individual components locally, I don't really want to fiddle around with padding and such. So I try this using moment.js:
moment().local().format(); // "2016-11-12T22:34:05+11:00"
Cool! Now I just need to adjust the format to a tiny bit:
moment().local().format('YYYY-MM-DThh:mm'); // "2016-11-12T10:39"
Waaaaaaait. Now it's in UTC again, even though I specified local.
In this particular case I could use string manipulation to just drop the end off for the date-time picker, but surely I'm going to reach a point where I want to output the local time in an arbitrary format. Am I missing something here?
Your second example isn't UTC, it's just using 12h format.
hh = 12h, HH = 24h. Try this instead:
moment().local().format('YYYY-MM-DTHH:mm')

Why new Date set as today gives back yesterday [duplicate]

This question already has an answer here:
Why is new Date() removing a day? - Javascript [duplicate]
(1 answer)
Closed 6 years ago.
This is the first time that I get this result.
I'm using a Telerik control RadDatePicker and I'm assigning the date client-side.
The thing is that the control doesn't accept a string as date, but a Date object in javascript
So, my code to set the date in the control is
var radDateControl = $find("radDateControl");
radDateControl.set_selectedDate(new Date('2016-04-26'));
But, I realized that the new Date is returning the date as yesterday! Why?
It's 5:58pm Eastern Time (US & Canada) right now. And if I do this
alert(new Date('2016-04-26'));
I get this
Mon Apr 25 2016 20:00:00 GMT-0400 (Eastern Daylight Time)
Why and how can I get the day as of today.
Update
What I finally did it was this. Hope it can help others.
var dateAsString = "2016-04-26";
var year = dateAsString.split('-')[0];
var month = dateAsString.split('-')[1];
var day = dateAsString.split('-')[2];
var date = new Date(Date.UTC(year, month - 1, day, 0,0,0));
date.setTime(date.getTime() + date.getTimezoneOffset() * 60 * 1000);
rpdDateControl.set_selectedDate(date);
The newly created date object is totally correct. The wrong part in here or at least the part confusing you is your browser, parsing the date object into your current timezone.
If you create a new date object and save it into a variable ...
var date = new Date('2016-04-26');
... you will get what you've asked for. A Date object representing the 26/04/2016 (in UTC).
Since you use your browser to get your date objects value, the value just gets parsed through your local timezone (in your case Eastern Daylight Time). So if you want to handle the correct date which you've used to create the new date object, you may use .toUTCString().
I know, parsing timezones can be really frustrating. In order to handle different timezones, you may try out Moment or Moment Timezone. I guess moment should fit your needs, but just for the completion.
Just use Date.now() instead. I'm not sure why the string isn't working but this will work anyways.
You are asking date 26, but with timezone changes it gives you back 2 hours, why not just alert(new Date()); and let it give you its current date?, also to check it go to the server using ssh and type date, if its not the date you are you can use tzselect to modify the server to your date

MomentJS set timezone

Because of how we store dates I need to set a moment object to timezone +0000.
I've tried using a variety of ways:
var d = moment().hour(0).minute(0).second(0).millisecond(0).zone('+0000');
var d = moment().hour(0).minute(0).second(0).millisecond(0).utc(0);
var d = moment().hour(0).minute(0).second(0).millisecond(0).utc();
When I console.log these dates they come out with the time 00:00:00 GMT+0100 (BST)
Looking at the documentation it seems to say that .utc() and .zone() are for printing a format only, is this true? (This is the same I've seen with other questions on here, none address setting the actual object to a timezone it seems)
After I set and then manipulate the date I convert it to the JS Date object to use with angular-ui bootstrap datepicker (note: it was a moment object which I used console.log on).
Unless you specify a timezone offset, parsing a string will create a
date in the current timezone.
http://momentjs.com/docs/#/parsing/string-format/
Example: You can tell in which timezone is your date using
moment ('2015-05-06T23:00:00.000Z').
If you need to convert this to a specific timezone you can do so:
moment().utc(0).format('YYYY-MM-DD HH:mm Z').
About Timezone in Javascript: How do I specify the time zone when creating a JavaScript Date?

AngularUI Datepicker without filter, what's happening?

I was using a angularUI datepicker in my webapp when I suddently came across this:
http://plnkr.co/edit/MLnWCtYHMNqLeuFOetWH?p=preview
In particular I am setting the date in my controller like this:
$scope.getDate = function() {
$scope.dt = new Date(2015,0,1);
};
$scope.getDate();
then in my html I display the date in this two ways:
<pre>With angular date filter date is: <em>{{dt | date:'medium' }}</em></pre>
<pre>Without angular date filter is: <em>{{dt}}</em></pre>
As you can see in this plunker, I have selected the date "01/01/2015" (january 1st, 2015) and if I see the plunker with the Angular date filter I get the correct date and time.
However, if I remove the filter, I get the same date 1 hour in the past.
It is surely a problem of timezones, but I cannot find any sources of this behavior, so I wanted to understand what's going on. Is there any explanation or a website to browse?
Also, what will arrive at the server? Do I have to do some special formatting on the server? (i cannot test this atm)
Don't know if this matters (I think yes), but my browser lives in Italy.
Both displayed dates are the exact same moment. They are just formatted differently. When you instantiate a date, your browser uses your current timezone (1st of January 2015 at midnight in Italy, so UTC+1).
When using a date filter, Angular displays your date in your current timezone whereas it displays the UTC date without.
Just try:
var date = new Date(2015,0,1);
date.toString(); // -> "Thu Jan 01 2015 00:00:00 GMT+0100 (CET)"
date.toISOString(); // -> "2014-12-31T23:00:00.000Z" (Z means UTC time)
As a rule of thumb, always use ISO8601 date format when sending your dates to the server (it is what JSON.stringify does when serializing an object with date values).

Java Script: How to ammend a datetime variable to set a specific time?

I need to take a datetime values from an MSSQL based app which is read into the script as 22/12/2010 3:56pm and adjsut the time component toa set time.
I've used what I know of javascript and what I can find in google searches to try and progress this but to no avail.
Premis: I need to read the date time value and set the time portion of the date to 8am, 1pm or 4pm dependent on another field.
The conditional logic portion of the script is fine the date functions aren't so fine.
Current code I'm currently using:
if(fldPriority.Value=='2')
{
var ResDate = new Date(fldTargetResolutionTime.Value);
var newdate = new Date(ResDate.getYear(),ResDate.GetMonth(),ResDate.GetDay(),16,0,0,0);
objReturn = newdate
}
Problem:
The date reads in originally in gmt format 22/12/2010 3:56pm but then gets changes to utc format and the date changes significantly to Wed Oct 12 15:56:00 UTC+12 2011
Any help would be greatly appreciated.
Make a copy of the Date and set the time using UTCHours.
The return value will be the correct Date and time,
but you if need to convert it to a string the string will be local time unless you call newDate.toUTCString();
(or objReturn.toUTCString())
var newdate=new Date(ResDate);
newDate.setUTCHours(16,0,0,0);
objReturn=newDate;

Categories

Resources