Develop Reference

JavaScript displaying correct date from dates stored as UTC on server

I have dates stored in my database in UTC format and calling
element.createdDate = new Date(element.createdDate.toString());
results in displaying the wrong date.
calling
element.createdDate = new Date(element.createdDate.toUTCString());
returns nothing. How do I go about displaying the correct time from UTC?

It appears that your json response contains a string valued which are in ISO8601 format in UTC, and then you are creating Date objects from them.
This part of your code is fine:
if (element.createdDate) element.createdDate = new Date(element.createdDate.toString());
You parse the string, and the resulting Date object is correct.
However, you don't need to use .toString() here, as the value is already a string. That is redundant.
This part of your code is the problem:
console.log("javascript date: " + new Date(element.depositDate.getUTCDate().toString()));
The getUTCDate function returns just the date of the month. Don't use that.
No matter what you do to create the Date object, ultimately you create a Date object and you're relying upon an implicit string conversion to output it. This will have different behavior in different browsers.
Consider console.log(new Date()):
In Chrome, this logs something like Fri Mar 17 2017 12:14:29 GMT-0700 (Pacific Daylight Time) on my computer. This is as if I called console.log(new Date().toString()); It is in an RFC 2822 like format (but not quite), and is represented in local time.
In Firefox, this logs something like 2017-03-17T19:14:46.535Z. This is as if I called console.log(new Date().toISOString()); It is in ISO8601 format, and is represented in UTC.
The point is, don't rely on implicit undefined behavior. If you must work with Date objects, then you should use console.log(element.createdDate.toISOString()) to see the ISO8601 representation of the UTC time.
If you're going to be doing a lot of things with dates and times, you may prefer to use a library, such as Moment.js, which can make tasks such as this more clear.

I have dates stored in my database in UTC format and calling
element.createdDate = new Date(element.createdDate.toString());
results in displaying the wrong date.
2016-10-11T00:00:00Z and Mon Oct 10 2016 20:00:00 GMT-04:00 (EDT) are exactly the same moment in time. The only difference is that one is displayed in ISO 8601 extended format with timezone offset 00:00 and the other is displayed in an RFC 2822 (like) format with timezone offset -04:00 (and assumes a locality in the EDT region).
calling
element.createdDate = new Date(element.createdDate.toUTCString());
returns nothing.
That is unusual. Typically it would return either a string or an error, but without a working example or any code to provide context it's impossible to say why.
How do I go about displaying the correct time from UTC?
You haven't specified what "correct" is. You are displaying a date and time for the same moment in time, just in a different format and time zone.

How do I deal with dates-only in javascript when it keeps appending a time value?

I have a bunch of date fields (not datetime) in SQL Server. When they are fetched by the web server and sent to the client as JSON a time stamp is appended automatically. So instead of receiving just 2016-09-27 I get 2016-09-27T00:00:00.
When the user interacts with the uiBootstrap calendar control it automatically parses that string into a javascript date object and applies a 4 hour offset for the timezone. When this is sent back to the server it's sent as 2016-09-26T20:00:00. Now my date is off by a day. Also the next time it's fetched it will happen again. But this time it will start at 2016-09-26T00:00:00 and will roll back to 2016-09-25T20:00:00. Each cycle between client and server loses a day.
How do I keep my dates from changing? I'm looking at moment.js but so far haven't really figured out how it can help me.
EDIT
I've setup a test function to try different methods of converting datetimes back and forth.
console.log('JSONDate: ' + JSONDate);
var dt = new Date(JSONDate);
console.log('JS Converted Date: ');
console.log(dt);
console.log('Date converted back to string: ' + dt.toISOString());
Here's the output:
JSONDate: 2016-10-02T00:00:00
JS Converted Date: Sun Oct 02 2016 00:00:00 GMT-0400 (Eastern Daylight Time)
Date converted back to string: 2016-10-02T04:00:00.000Z
In this example the date is now 4 hours ahead.
EDIT 2
Web server is running .net, specifically WebAPI 2. I'm using Entity Framework 6 to communicate between web server and SQL Server 2012.

Ideally, your dates would be serialized in the JSON as just dates. Instead of 2016-10-02T00:00:00, you'd have 2016-10-02. The problem is that .NET doesn't have a built in Date type. It only has DateTime. There are alternatives, such as LocalDate in Noda Time, as discussed in this answer.
However, assuming you don't want to change anything on the back-end, the way to handle this is just to make sure the input date/time is treated as local time, and never converted to/from UTC. This should be the default behavior when you parse the string into a Date object when the string is like 2016-10-02T00:00:00, but the behavior has changed a few times over the years, so if you are potentially dealing with older browsers, you may get some that interpret it as UTC instead.
As far as output goes, the toISOString method of the Date object always outputs in UTC - which is the source of your conversion error. If you want an ISO8601 string in local time - you'd have to construct one yourself using the various accessor functions (getFullYear, etc.), handling zero-padding, and ensuring months are incremented to be 1-based instead of 0-based.
The easier solution is to use moment.js, which can handle this for you.
var d = moment('2016-10-02T00:00:00').toDate(); // now you have a `Date` object
var s = moment(d).format("YYYY-MM-DD[T]HH:mm:ss"); // now you have a string again
Of course, if you don't need the time portion, you can omit it from the format string and the rest should still work out ok.

You could try getting the offset and applying it back to the date. Something like this:
var d = new Date('2016-09-27'); //Mon Sep 26 2016 20:00:00 GMT-0400 (EDT)
new Date(d.getTime() + d.getTimezoneOffset() * 60 * 1000) //Tue Sep 27 2016 00:00:00 GMT-0400 (EDT)

Adding +GMT in Javascript

Good day, I would like to ask how can I add any timezone in my date object?
My scenario is I have created a date picker and time picker and they will generate a DateTime Object looking like "01/02/2003 4:56 PM" I just need to add the GMT +/- (Timezone) in the date time object so it can look like "01/02/2003 4:56 PM GMT + 0700" and my backend will process the conversion to utc.
Is it possible? Thank you and good day.

You can use new Date("01/02/2003 4:56 PM") which will return time zone information.

How to keep the Date as it is without being converted into local time zone?

I am having issue with the localtime zone things in javascript. If I got a string value from the server is "2014-02-03T00:00:00.000Z", once I pass it into Date object new Date('2014-02-03T00:00:00.000Z'), the new date object will be in localtime zone ex. Sun Feb 02 2014 18:00:00 GMT-0600 (CST). How to keep the value as 'Mon Feb 03 2014 00:00:00' ? I see a lot of people is using moment.js for dealing date, but I don't find any help with this issue.
Thanks

You can use getUTCDate() method. It will return you correct date.
http://jsbin.com/zizukapuba/1/edit?output
It will convert the date into required format with reference to system local timezone.
NOTE: If you use, the getISOString() method, then it will again make the changes with reference to your local time, that is, GMT -6.00.

The Date object stores your date as "2014-02-03T00:00:00.000Z".
When you display your Date object, the toString() function is used to get a string to display the date. toString() displays the date using the local time zone. Try using the toISOString() function or toUTCDateString().

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).