Tuesday, May 6, 2014

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.

 

 

CODE

 

  1: <!doctype html>
  2: <html lang="en">
  3: <head>
  4: <meta charset="utf-8">
  5: <title>jQuery UI Datepicker - Default functionality</title>
  6: <link rel="stylesheet" href="//code.jquery.com/ui/1.10.4/themes/smoothness/jquery-ui.css">
  7: <script src="//code.jquery.com/jquery-1.10.2.js"></script>
  8: <script src="//code.jquery.com/ui/1.10.4/jquery-ui.js"></script>
  9: <link rel="stylesheet" href="/resources/demos/style.css">
 10: <script>
 11: $(function() {
 12: $( "#datepicker" ).datepicker();
 13: });
 14: </script>
 15: </head>
 16: <body>
 17: <p>Date: <input type="text" id="datepicker"></p>
 18: </body>
 19: </html>

 


DEMO





Add this widget to your website for $10. Please contact us : info@9pixle.com


Tagged

0 comments

Subscribe to: Post Comments (Atom)

Thank you for visiting 9pixle.