Bootstrap Datetime Picker output return date automatically

Question

I have a working code below, Please help me to fix the second script that i have below, what im trying to do is once you pick any date in the pickup datetime picker and choose the duration on the select field it will automatically fill up the return date base on the duration that you choose from the duration select and start date that you have

First Code js code: (It works since the default date is our current date)

$(document).ready(function() {

$('#datetimepicker8').datetimepicker({ sideBySide: true, toolbarPlacement: "bottom", showClose: true, stepping: 30, minDate: new Date(), defaultDate : Date.now() });
$('#datetimepicker9').datetimepicker({ sideBySide: true, toolbarPlacement: "bottom", showClose: true, stepping: 30, minDate: new Date()});

$('select[name = sas]').on('change', function() {

    var futureDate = new Date(Date.now());
    futureDate.setMonth(futureDate.getMonth() + parseInt(this.value));
    $('#datetimepicker9').data("DateTimePicker").date(futureDate);

});
})

Second JS Code Not working

$(document).ready(function() {

    $('#datetimepicker8').datetimepicker({ sideBySide: true, toolbarPlacement: "bottom", showClose: true, stepping: 30, minDate: new Date()});
    $('#datetimepicker9').datetimepicker({ sideBySide: true, toolbarPlacement: "bottom", showClose: true, stepping: 30, minDate: new Date()});

    $('select[name = sas]').on('change', function() {

        //start date
        $('#datetimepicker8').data("DateTimePicker").date(Date.now());

        //future date
        var futureDate = new Date(Date.now());
        futureDate.setMonth(futureDate.getMonth() + parseInt(this.value));
        $('#datetimepicker9').data("DateTimePicker").date(futureDate);

    });

})

HTML

<select name="sas">
      <option disabled selected value required>Duration: 1-36 Months</option>
      <option value="1">1 Month</option>
      <option value="2">2 Months</option>
      <option value="3">3 Months</option>
      <option value="4">4 Months</option>
      <option value="5">5 Months</option>
      <option value="6">6 Months</option>
      <option value="7">7 Months</option>
      <option value="8">8 Months</option>
      <option value="9">9 Months</option>
      <option value="10">10 Months</option>
      <option value="11">11 Months</option>
      <option value="12">12 Months</option>
      <option value="13">13 Months</option>
      <option value="14">14 Months</option>
      <option value="15">15 Months</option>
      <option value="16">16 Months</option>
      <option value="17">17 Months</option>
      <option value="18">18 Months</option>
      <option value="19">19 Months</option>
      <option value="20">20 Months</option>
      <option value="21">21 Months</option>
      <option value="22">22 Months</option>
      <option value="23">23 Months</option>
      <option value="24">24 Months</option>
      <option value="25">25 Months</option>
      <option value="26">26 Months</option>
      <option value="27">27 Months</option>
      <option value="28">28 Months</option>
      <option value="29">29 Months</option>
      <option value="30">30 Months</option>
      <option value="31">31 Months</option>
      <option value="32">32 Months</option>
      <option value="33">33 Months</option>
      <option value="34">34 Months</option>
      <option value="35">35 Months</option>
      <option value="36">36 Months</option>
</select>

Unknown Unknown · Accepted Answer · 2019-03-30T17:30:13

$(document).ready(function() {

$('#datetimepicker8').datetimepicker({ sideBySide: true, toolbarPlacement: "bottom", showClose: true, stepping: 30, minDate: new Date() }); 
$('#datetimepicker9').datetimepicker({ sideBySide: true, toolbarPlacement: "bottom", showClose: true, stepping: 30, minDate: new Date()});                                    

$('select[name = sas]').on('change', function() {

    //start date
   var objs = $('#datetimepicker8').data('DateTimePicker').date()


    //future date

     var futureDate = new Date(objs);
    futureDate.setMonth(futureDate.getMonth() + parseInt(this.value));
    $('#datetimepicker9').data("DateTimePicker").date(futureDate);

});

})

Bootstrap Datetime Picker output return date automatically

1 Answers