Native Date Picker in Html

12,403

Solution 1

"Native" and "without JavaScript" is where this idea will not work on older browsers. You could always create an HTML5 datepicker, and non-supportive browsers will fallback to a plain textbox. You could instruct the user to enter a date in MM/DD/YYYY format, and have this format applied by the datepicker, or by hand if the datepicker is unavailable.

This page offers some advice on the HTML5 datepicker: http://html5tutorial.info/html5-date.php

Edit: Alternatively, you could just create three dropdown menus and have the user select the month, day, and year. (Of course without JS in this case, you couldn't have the number of days in a month change with the user's choice, but you could always validate their input on the server.)

Solution 2

You could instruct the user to enter a date in MM/DD/YYYY format, spryno724

This, a simple html5 placeholder (you can also style css placeholder) would suffice.

<input type='text' placeholder='dd/mm/yyyy' name='form[datetime]' id='datetime' />
Share:
12,403
mani
Author by

mani

Updated on July 12, 2022

Comments

  • mani
    mani almost 2 years

    I used Datepicker plugin for getting Calendar in HTML. But my boss ordered me not to t use any jquery plugins for date picker. He is saying that I must use native code only for date picker. It should work without Javascript also.

    Is it possible to create native calendar in html ?

    I know html5 supports native date picker; but that is not supported by all browsers.

    Can i get native date picker as following style..?

    enter image description here

  • Oliver Spryn
    Oliver Spryn almost 10 years
    "He is saying that I must use native code only for date picker. It should work without Javascript also." He mentioned this in the question.
  • Oliver Spryn
    Oliver Spryn almost 10 years
    Good idea, however, if the browser doesn't support a datepicker, it likely won't support a placeholder value, either. Both of these were officially added as enhancements to the HTML5 specification. :(
  • DoXicK
    DoXicK almost 10 years
    i know that, and that is why i mentioned AS A FALLBACK. Since he also mentioned 'it should work without javascript also' and '... but that is not supported by all browsers'. I know developers like to fix everything with jQuery so i can understand his boss asking to fix it without it. But i also think his boss rather has a fallback to not block out 30% of the internet.
  • Oliver Spryn
    Oliver Spryn almost 10 years
    I suppose... I just figured the OP meant a datepicker of some sort should work without JS and browser support.
  • mani
    mani almost 10 years
    @spryno724 thanks for answers. I need the following style for native Date Picker.