How to detect date format defined by browser? - javascript

I'm using HTML5 input type=date field and because some browsers still don't support this feature, I would like to create error validation message for browsers that display just normal text field instead of date field. This error message should look like
Please enter date in format: ...
But I need to find the correct format, that the browser is set to. Is there any php/js/jQuery way how to find out this?

Thanks to #Jose Vega's answer I was able to find very easy way how to do it.
var now=new Date(2013,11,31);
var str=now.toLocaleDateString();
str=str.replace("31","dd");
str=str.replace("12","mm");
str=str.replace("2013","yyyy");
Error message:
"Please enter date in format:" + str

I have used the globalize library to do something similar. I don't know if its functionality has what you are looking for, but I know it does a good job handling different cultures. I use the window.navigator.userLanguage to determine culture and then feed it to the globalize library to do its thing. I've had success when dealing with currency and numbers.
EDIT: See if this helps:
var now=new Date();
alert(now.toLocaleString());
taken from How format JavaScript Date with regard to the browser culture?
Reference Displaying proper date format depending on culture

Why not to allow users to enter date in any format they like.
E.g. i am tourist in the USA and the browser says me to use format mm/dd/YYYY instead of my native dd.mm.YYYY.
Just get any date entered by users and parse it with Date.parse()

Related

Using moment.js, how to display the current date format for the user?

Given a text field, I want to have a suitable placeholder. A typical placeholder will be something like: "mm/dd/yyyy".
However, I would like to use locale-aware dates using moment.js.
This means that I will be specifying "l" as the moment.js date format, howe do I determine the date format that moment.js will be using in this case?
The user will not understand what "l" means, so using this value in the placeholder text makes very little sense.
Specifically, I am hoping to be able to access something like moment's internal "defaultLongDateFormat". (Though that is merely a default - moment.js probably updates it or has some other mapping at runtime for locale-aware date formats - I would like to access that mapping.)
EDIT:
There are multiple downvotes (who aren't explaining why they're downvoting it).
I think this is because they arent' understanding the question, so here are some examples:
I want a function such that:
getFormat("l") -> "mm/dd/yyyy", or equivalent for the US locales.
getFormat("l") -> "dd/mm/yyyy", or equivalent, for the AU locales.
I do not want to format a given date, or to parse a given date - I merely want to determine it's user-friendly format given an arbitruary moment.js format, specifically, for 'l'.
I don't think it's exposed nicely, but if the browser has its language configured correctly you can do something like this:
var lang = navigator.languages ? navigator.languages : navigator.language;
moment().locale(lang).localeData()._longDateFormat['L']
Languages behave slightly differently depending on which browser you're using, so don't know how reliable this is.
Follow up to Adam R's answer:
Seems to have been exposed by now:
localeData.longDateFormat(dateFormat);
returns the full format of abbreviated date-time formats LT, L, LL and so on
(source: http://momentjs.com/docs/)
Get the currently used locale data by moment.localeData()

Date format changing according to browser

This is my JS function for displaying the date in the browser, but the format is changing according the browser. Means when i open my project on chrome then format is 4/30/2015, and when open on IE then 30 april, 2015. How can i fix this?
document.getElementById(lblClock).innerHTML = nd.toLocaleString();
I am using this. How can i do this without using Date.js and moment.js? Please help me
Nothing Special about this previously i was using this which convert the locale date into a string.
document.getElementById(lblClock).innerHTML = nd.toLocaleString();
Just give your specific format in which you want to see your date just like this.
document.getElementById(lblClock).innerHTML = nd.format('dddd,MMM dd,yyyy,HH:mm:ss');
It will work on any browser or any version.
Try to use date format lib from http://blog.stevenlevithan.com/archives/date-time-format
or try to find something similar

Display HTML5 DateTime-local base on User's Locale/Culture

How to display the value of this base on user's locale/culture?
Right now it displaying US format (mm/dd/yy) and I need UK format (dd/mm/yy).
I would also like to display base on thes user's locale format or detect where's the user's locale.
Something like the javascript toLocaleString().
<input type="datetime-local" value="">
That is not supported by browser yet. See following post.
http://weblog.west-wind.com/posts/2012/Nov/08/HTML5-Input-typedate-Formatting-Issues.
So you need to manage it via server side code for example If you want to do it with ASP.NET here is the post which will help you.
http://msdn.microsoft.com/en-us/library/bb882561(v=vs.110).aspx
For JavaScript, you need to use tolocalstring as you have mentioned in your question.
http://www.w3schools.com/jsref/jsref_tolocalestring.asp
navigator.isBritish=(function(){
return new Date('12/6/2009').getMonth()===5;
})();
Handy for setting up the order of inputs and date displays, anyway.

Create a valid regular expression when using input type="date"

I am using a simple date regex to validate an input string is in the desired format:
In this case dd/mm/yyyy
THE ISSUE
Regular expression for date validation fails in Google Chrome when using type="date":
Displays: dd/mm/yyyy
Renders: yyyy-mm-dd (Here lies the issue)
QUESTION
How to use regex (or alternative) to validate a date string across browsers when using type="date"?
NOTE: Using regex to validate yyyy-mm-dd is not a valid solution unless the end user still sees dd/mm/yyyy.
<input type="date" /> internally handles dates like so:
> xkcd
Therefore your format should be ^\d{4}-\d\d-\d\d$. Note however that you will need to provide clear instruction to users if their browser doesn't support type="date", or provide a JavaScript calendar alternative, otherwise people won't understand!
Due to the current support for type="date" being so small, it's probably best to use JavaScript and have a hidden input field to store the YYYY-mm-dd format date and validate that, while letting the user type freely into the real input field and try to parse that.

Mobile HTML5 App - determining a users date/time preferences?

Is there any way via HTML5, proprietary apis, or PhoneGap to obtain the date format a given user is likely to want?
I currently display everything as MM/dd/yyyy, but this is confusing for any users who live in dd/MM/yyyy countries.
I believe you will want to look into the Globalization plugin's getDatePattern method.
https://github.com/phonegap/phonegap-plugins/tree/master/Android/Globalization
https://github.com/phonegap/phonegap-plugins/tree/master/BlackBerry/Globalization
https://github.com/phonegap/phonegap-plugins/tree/master/iPhone/Globalization
The simplest way to determine the local day-month/month-day order is to check it.
You can check once and save it as a boolean to use in any input or output date formatting.
(this returns true if the date should precede the month- feel free to reverse it!).
Date.datefirst= (function(){
return Date.parse('2/6/2009')> Date.parse('6/2/2009');
})()

Categories

Resources