jQuery DatePicker - 2 Fields

Question

Hello,

I'm currently working with jQuery and using the datepicker.

I have two input fields: Start Date and End Date. When each is clicked, the datepicker pops out.

For the "End Date" field, I would like the jQuery date picker to highlight the same day. For example, if a user picks 8/12/09 as their start date, for the End Date, they cannot pick anything BEFORE 8/12/09.

Here's what I currently have:

$("#datepicker").datepicker({minDate: +5, maxDate: '+1M +10D', changeMonth: true});
var startDate = $("#datepicker").val();
var the_date = new Date(startDate);
$("#datepicker2").datepicker({ minDate: the_date });

And, unforunately, this does not work.

I have found that if I "hard-code" the values in, like:

$("#datepicker2").datepicker({ minDate: new Date("08/12/2009") });

it will work fine. Any ideas on how to pass the "start date" to the "end date" picker?

Thanks!

Answer 1

this cant work

you need a callback function from the date picker for the "picking" event. befor this event your startDate will be empty.

try this:

$("#datepicker").datepicker({
     minDate: +5, 
     maxDate: '+1M +10D', 
     changeMonth: true, 
     onSelect: function(dateText, inst){
               var the_date = new Date(dateText);
               $("#datepicker2").datepicker('option', 'minDate', the_date);
     }
 });
 $("#datepicker2").datepicker(); // add options if you want

Answer 2

start date end date http://rowsandcolumns.blogspot.com/2010/07/jquery-start-dateend-date-datepicker.html