In booking related projects or in date wise report generation, we need to set from and to date for getting exact results as we want. So in this tutorial, I am going to explain you how to create from and to date using popular jQuery datepicker plugin in a very simple way.
First of all, create a index.php file and add two text boxes and set name and id with from_date and to_date respectively.
<input type="text" id="from_date" name="from_date" value="" /> <input type="text" name="to_date" id="to_date" value="" />
And add below Jquery code in footer area as below.
<script type="text/javascript"> $(function() { $( "#from_date" ).datepicker({dateFormat: 'd-M-yy',numberOfMonths: 2,minDate: 0,onSelect: function (selected) { var dt = new Date(selected); dt.setDate(dt.getDate() + 1); setTimeout(function() { $('#to_date').datepicker('show'); }, 300) $("#to_date").datepicker("option", "minDate", dt); }}); $( "#to_date" ).datepicker({dateFormat: 'd-M-yy',numberOfMonths: 2,onSelect: function (selected) { var dt = new Date(selected); dt.setDate(dt.getDate() - 1); $("#from_date").datepicker("option", "maxDate", dt); }}); }); <script>
That’s it. Thank you for taking interest in my blog.