Q:

How to show date like end date future dates depends on start date

I have two datepickers. I want to show enddate depends on startdate, not in reverse order.
Example:
startdate:07/02/2018  enddate: 07/16/2018 == correct - should be enable 16
startdate:07/02/2018  enddate: 07/02/2018 == wrong -should be disable  02(enddate)

I want to show only future dates in enddate after I selected startdate. How can I do it? I have only 2,16 dates for all months and years. start date and enddate should not be same..enddate should be future date depends on startdate. http://jsfiddle.net/FdfPY/771/
Js:
  var disabledDates = []
  $("#from").datepicker({
  minDate: 'D',
  dateFormat: "dd/mm/yy",
  defaultDate: "+1w",
  numberOfMonths: 1,
        beforeShowDay: function(d) { 
        if (d.getDate() == 2 || d.getDate() == 16) {
          return [true, "" ];
        } else {
           return [false, "" ];
        }
     },
  onClose: function(selectedDate) {
  disabledDates=[selectedDate];
    $("#to").datepicker("option", "minDate", selectedDate); 
     }
    });

  $("#to").datepicker({
  minDate: 0,
  dateFormat: "dd/mm/yy",
  defaultDate: "+1w",
  numberOfMonths: 1,
        beforeShowDay: function(d) {  

        if (d.getDate() == 2 || d.getDate() == 16) {
          return [true, "" ];
        } else {
           return [false, "" ];
        }
     } 
     });

HTML:
Start Date:<input type="text" name="date" id="from" readonly="readonly" size="12" />
End Date:<input type="text" name="date2" id="to" readonly="readonly" size="12" />

A:

JSFiddle
I had trouble getting your example to work, so I had to add the labels in the HTML as I did in my example. 
You were very close with your attempt by filtering available dates using the beforeShowDay param. I optimised it a bit and this seems to do the job. Using the onClose param on the first input you then set the minimum date on the second datePicker.
HTML
<label for="from">From</label>
<input type="text" id="from" name="from" readonly size=12/>
<label for="to">to</label>
<input type="text" id="to" name="to" readonly size=12/>

JavaScript
function check_available_days(date) {
  const available_formatted_days_list = [2, 16];
  const currentDay = date.getDate();
  return available_formatted_days_list.includes(currentDay)
    ? [true, "", ""]
    : [false, "date-disabled", "Date not available"];
}

$("#from").datepicker({
    minDate: "dateToday",
    beforeShowDay: check_available_days,
    changeMonth: true,
    dateFormat: 'dd-mm-yy',
    onClose: function (selectedDate, instance) {
        if (selectedDate !== '') {
            $("#to").datepicker("option", "minDate", selectedDate);
            $("#to").datepicker("option", "maxDate", date);
        }
    }
});
$("#to").datepicker({
    minDate: "dateToday",
    beforeShowDay: check_available_days,
    changeMonth: true,
    dateFormat: 'dd-mm-yy',
    onClose: function (selectedDate) {
        $("#from").datepicker("option", "maxDate", selectedDate);
    }
});

I hope this helps.

