0

I have From Date and To Date jQuery datepicker controls and if I change From Date, then To Date should automatically be 180 days from From Date

Below code is not firing the onSelect event even if this looks so simple...

$("#txtFrom").datepicker({
        minDate: 0,
        onSelect: function (dateStr) {
            var newDate = $(this).datepicker('getDate');
            if (newDate) {
                newDate.setDate(newDate.getDate() + 180);
            }
            $('#txtTo').datepicker('setDate', newDate).datepicker('option', 'minDate', newDate);
        }
    });

Also, I require onChange event to be fired...

Any help would be greatly appreciated.

CPK_2011
  • 872
  • 3
  • 21
  • 57

1 Answers1

1

I have replicated your scenario. Hope this helps.

<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title>jQuery UI Datepicker - Default functionality</title>
  <link rel="stylesheet" href="//code.jquery.com/ui/1.13.2/themes/base/jquery-ui.css">
  <link rel="stylesheet" href="/resources/demos/style.css">
  <script src="https://code.jquery.com/jquery-3.6.0.js"></script>
  <script src="https://code.jquery.com/ui/1.13.2/jquery-ui.js"></script>
  <script>
  $( function() {
    $( "#datepicker" ).datepicker({
        onSelect:function(dateStr){
            var oldDate = $(this).datepicker('getDate');
            var newDate = new Date(oldDate.setMonth(oldDate.getMonth()+7))
            newDate=(newDate.getMonth()+1)+'/'+(newDate.getMonth()+1)+'/'+newDate.getFullYear()
            document.getElementById("datepicker1").value = newDate;
        }
    });
  } );
  </script>
</head>
<body>
 
<p>From_Date: <input type="text" id="datepicker"></p>
<p>To_Date: <input type="text" id="datepicker1"></p>
 
</body>
</html>
shravan kumar
  • 28
  • 4
  • Is it possible to have a DatePicker icon next to the Text control. Also, currently, I cannot change the Year directly. I have to scroll through each month. – CPK_2011 Sep 10 '22 at 22:07
  • yes, you have to scroll to each month. That's how basic date picker works. But you can search for other date picker libraries in which you can scroll through the year. Hope this helps. Upvote if it's helpful. – shravan kumar Sep 10 '22 at 22:20