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
Multiple 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 Multiple date picker elements.Multiple 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.It shows multiple date menus in input box.
Functionality Of Multiple Date PickerJquery provides Multiple date picker functionality that transforms the <input>,
<div>, and <span> elements in the wrapped set into a date picker
control. Multiple 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 Multiple 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
Multiple date Picker functionality is mentioned in
head tag.This should be written after the link sheets mentioned above.
<script>
$(function () {
$("#datepicker").datepicker({
numberOfMonths: 4,
showButtonPanel: true
});
});
</script>
From the above code, we can display date menu by changing number's in the code script.It should be more than one to run the Multiple date picker.
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 Multiple date picker code. In this we use input type and Id attributes.
Example of the written Multiple Date picker code is shown below
Above is the example of Multiple date
picker.When we click on the in put box date picker function works and
appears date menu. Here in input box multiple date menu appear's as we mention in the code(numberOfmonths:4).It is shown in below image
Conclusion
In this article we discussed about
Multiple Date picker functionality in jquery. Previously we have learnt about
Default datepicker functionality and Animation date picker functionality. Here in this functionality changes in each and every datepicker which we have written in code. Hope You Understand