I need to show only future one month dates in the date picker from the start date selection
Question
enter code here
$("#StartDate").datepicker({ dateFormat: 'dd/mm/yy', onSelect: function (selectedDate) { if (this.id == 'StartDate') { //console.log(selectedDate);//2014-12-30 var arr = selectedDate.split("/"); var date = new Date(arr[2]+"-"+arr[1]+"-"+arr[0]); var d = date.getDate(); var m = date.getMonth(); var y = date.getFullYear(); var minDate = new Date(y, m, d + 1); $("#EndDate").datepicker('setDate', minDate); } } }); $("#EndDate").datepicker({dateFormat: 'dd/mm/yy'});
<input id="StartDate" type="text" name="StartDate"> <input id="EndDate" class="datepicker" type="text" name="EndDate">
Any required plugins given are appreciable.
Here the requirement is like I have two input fields one is for start date and another is for end date for eg if the select start date as 21-05-2020 and auto automatically the end date input filed should fetch the future one month dates as 21-06-2020. finally the output should be like start date: 21-05-2020 to end date: 21-06-2020.
1 answers
solution1
0 2020-05-21 02:25:56
You just need to add both minDate and maxDate properties, something like this (click the Run code snippet button down below for a live demo):
$(function() { $("#datepicker").datepicker({ minDate: 0, // ban dates in the past maxDate: "+1M" // allow only 1 month in the future }); });
<link href="https://code.jquery.com/ui/1.12.1/themes/smoothness/jquery-ui.css" rel="stylesheet" type="text/css" /> <script src="https://code.jquery.com/jquery-3.1.0.js"></script> <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script> <body> <p>My cool date Date: <input type="text" id="datepicker"></p> </body>
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.