Question

I use the jQuery Datepicker for two different text fields. One field for start date and another for end field. I disable date before current date using minDate. My code is like this:

$( "#start" ).datepicker({
    minDate: 0,
    dateFormat: 'yyyy-mm-dd',
    showOnFocus: true,
    showTrigger: '<img src="<?php echo base_url()?>images/calender.png" />'
});    

$( "#end" ).datepicker({
    minDate: 0,
    dateFormat: 'yyyy-mm-dd',
    showOnFocus: true,
    showTrigger: '<img src="<?php echo base_url()?>images/calender.png" />'
}); 

Now I need to check that end date must be equal to or greater than start date. And in the end date field, all dates before the start date selected must be disabled. How can it be done?

Answer 1

Firstly thanks to all who help me to find the answer.

Solution for my question is by using following codes:

$(document).ready(function(){
  $("#depart ,#return_date").datepick({
    minDate:0,
    dateFormat:'yyyy-mm-dd',
    showOnFocus: true,
    showTrigger: '<img src="<?php echo base_url()?>images/calender.png" />',
    onSelect: customRange
  });

  function customRange(dates) {
    if (this.id == 'depart')
    {
      $('#return_date').datepick('option', 'minDate', dates[0] || null);
    }
    else
    {
      $('#depart').datepick('option', 'maxDate', dates[0] || null);
    }
  }
});