How to force the input date format to dd mm yyyy

Question

I have a little problem  I am developing a web system and the form field type date is giving me a headache  The system will be for Brazil only users  then the date format should be dd mm yyyy  When access the site from a computer with the Portuguese language  the date of the HTML form field type works the way I want  But when access the site in a computer language English date format becomes yyyy-mm-dd  This is a problem because sometimes user does not even notice that your computer s date format is changed  but the user wants to see the date in the format dd mm yyyy   What I need is that the format is dd mm yyyy regardless of machine settings to access the site  and without using any additional javascript library   The code used is    lt input type  date  id  date  gt

User · Answer

DEMO   http   jsfiddle net shfj70qp     dd mm yyyy   var date   new Date    var month   date getMonth    var day   date getDate    var year   date getFullYear     console log month     day     year

User · Answer

No such thing  the input type date will pick up whatever your system default is and show that in the GUI but will always store the value in ISO format  yyyy-mm-dd    Beside be aware that not all browsers support this so it s not a good idea to depend on this input type yet   If this is a corporate issue  force all the computer to use local regional format  dd-mm-yyyy  and your UI will show it in this format  see wufoo link before after changing your regional settings  you need to reopen the browser     See  http   www wufoo com html5 types 4-date html for example See  http   caniuse com  feat input-datetime  for browser supports See  https   www w3 org TR 2011 WD-html-markup-20110525 input date html  for spec   lt - no format attr    Your best bet is still to use JavaScript based component that will allow you to customize this to whatever you wish

User · Answer

To have a constant date format irrespective of the computer settings  you must use 3 different input elements to capture day  month  and year respectively  However  you need to validate the user input to ensure that you have a valid date as shown bellow   lt input id  txtDay  type  text  placeholder  DD    gt    lt input id  txtMonth  type  text  placeholder  MM    gt    lt input id  txtYear  type  text  placeholder  YYYY    gt   lt button id  but  onclick  validateDate    gt Validate lt  button gt      function validateDate         var date   new Date document getElementById  txtYear   value  document getElementById  txtMonth   value  document getElementById  txtDay   value        if  date     Invalid Date             alert  jnvalid date

[html] How to force the input date format to dd/mm/yyyy?

Examples related to html

Examples related to date

Examples related to datetime