Skip to content
Related Articles

Related Articles

Improve Article

How to set input type date in dd-mm-yyyy format using HTML ?

  • Last Updated : 28 Jul, 2021

To set and get the input type date in dd-mm-yyyy format we will use <input> type attribute. The <input> type attribute is used to define a date picker or control field. In this attribute, you can set the range from which day-month-year to which day-month-year date can be selected from. If min and max values are not set then default min value is set to “01-01-1920” and default max value is set to “01-01-2120”.

Example 1: This example uses <input type=”date”> attribute to get the date in dd-mm-yyyy format.




<!DOCTYPE html>
<html>
  
<head>
    <title>
        How to get input type date
        in dd-mm-yyyy format ?
    </title>
      
    <style>
        body {
            text-align: center;
        }
        h1 {
            color: green;
        }
    </style>
</head>
  
<body>
    <h1>GeeksforGeeks</h1>
      
    <h3>
        Get input date in
        dd-mm-yyyy format
    </h3>
      
    <label for="start">
        Enter the Date:
    </label>
  
    <input type="date" name="begin" 
        placeholder="dd-mm-yyyy" value=""
        min="1997-01-01" max="2030-12-31">
</body>
  
</html>

Output:

Example 2: This example uses <input type=”date”> attribute to get the date in dd-mm-yyyy format.




<!DOCTYPE html>
<html>
  
<head>
    <title>
        How to get input type date
        in dd-mm-yyyy format ?
    </title>
      
    <style>
        body {
            text-align: center;
        }
        h1 {
            color: green;
        }
    </style>
</head>
  
<body>
    <h1>GeeksforGeeks</h1>
      
    <h3>
        Get input date in
        dd-mm-yyyy format
    </h3>
      
    <label for="Date of Birth">
        Enter the Date:
        <input type="date" name="date">
    </label>
</body>
  
</html>

Output:

HTML is the foundation of webpages, is used for webpage development by structuring websites and web apps.You can learn HTML from the ground up by following this HTML Tutorial and HTML Examples.

Attention reader! Don’t stop learning now. Get hold of all the important Comcompetitivepetitve Programming concepts with the Web Design for Beginners | HTML  course.




My Personal Notes arrow_drop_up
Recommended Articles
Page :