Saturday, 13 May 2017

Simple date picker using jquery

Date Picker:

The datepicker is tied to a standard form input field. Focus on the input (click, or use the tab key) to open an interactive calendar in a small overlay. Choose a date, click elsewhere on the page (blur the input), or hit the Esc key to close. If a date is chosen, feedback is shown as the input's value.

Browser: All

Code: follow the bellow code for your website.

======================================

<!DOCTYPE html>

<html>
<head>
    <title></title>
    <link rel="stylesheet" href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">
<script src="//code.jquery.com/jquery-1.10.2.js"></script>
<script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
<script>
    $(function () {
        // Find any date inputs and override their functionality
        $('input[type="date1"]').datepicker();
    });
</script>
</head>
<body>
    <p>Select a date</p>
    <input type="date1" name="datepicker" id="datepickerid" />
  </body>
</html>

=====================================