Jquery is fast and rich Javascript library. It create things in html documents, event handling and animations. It is easy to use API that works across a browser
Introduction
The date picker (options) method
declares that an <input> element should be managed as a date
picker. The options parameter is an object that specifies
the behavior and appearance of the date picker elements.
Default
functionality of Date picker
In jQuery Date pickers allow users to enter dates easily and visually. we can easily customize the date format and language, restrict the selectable date ranges and add in buttons and other navigation options
Functionality Of Date Picker
JQuery provides date picker functionality that transforms the <input>,
<div>, and <span> elements in the wrapped set into a date picker
control. Date picker () method that creates a date picker and changes
the appearance of HTML elements on a page by adding new CSS classes.
Here we mentioned an example for Date Picker() method default functionality.
This style sheet links should be written in the head tag
<head>
<link rel="stylesheet" href="//code.jquery.com/ui/1.11.2/themes/smoothness/jquery-ui.css">
<script src="//code.jquery.com/jquery-1.10.2.js"></script>
<script src="//code.jquery.com/ui/1.11.2/jquery-ui.js"></script>
</head>
The function code of the
date Picker functionality is mentioned in
head tag.This should be written after the link sheets mentioned above.
<script>
$(function () {
$("#datepicker").datepicker();
});
</script>
We have to write the code in body tag here below it is shown clearly
<body>
<p>Date: <input type="text" id="datepicker"/></p>
</body>
In the above code, we have date picker code. In this we use input type and Id attributes.Example of the written Date picker code is shown below
When we click on the text box ,date picker dialog box will appear.
It is shown in below image.
Conclusion
In this article we discussed about
Date picker functionality in
Jquery. Previously we have learnt about
Accordion functionality. Hope you understand
Reference
http://jqueryui.com/