JQuery datepicker variable minDate

I am using jQuery datepicker. In the "EndDate" text box, I would like to use the date selected from the "StartDate" + 1 text box. How do I do this?

I tried this but did not work. In my starter code, I had ...

test = $(this).datepicker('getDate'); testm = new Date(test.getTime()); testm.setDate(testm.getDate() + 1); 

Then at my end of the date code I had ...

 minDate: testm, 

but the end date was still made for the whole month.


Change I am curious why this is not working. In my datepicker start date, I have this ..

 onSelect: function (dateText, inst) { test = dateText } 

Why can't I go down to datepicker date and say: minDate: test ?


Change Still not working

  $(".dateStartDatePickerBox").datepicker({ minDate:'-0d', onSelect: function(dateText, inst) { test = $(this).datepicker('getDate'); testm = new Date(test.getTime()); testm.setDate(testm.getDate() + 1); $("#dateEndDatePickerBox").datepicker("option", "minDate", testm); } }); $(".dateEndDatePickerBox").datepicker({ onSelect: function() { } }); 
+7
javascript jquery datepicker
source share
3 answers

You need to set the dynamic date min in the start date change event.

Something like:

 $("#startDate").change(function() { test = $(this).datepicker('getDate'); testm = new Date(test.getTime()); testm.setDate(testm.getDate() + 1); $("#endDate").datepicker("option", "minDate", testm); }); 

Reply to edit:

You cannot do the following:

 var test; $("#myinput").datepicker({ onSelect: function() { test = $(this).datepicker("getdate"); } }); $("#myotherinput").datepicker({ minDate: test }); 

The test is not initialized when minDate is set to myotherinput . The minDate installation process undoubtedly requires DOM manipulation, which the datepicker controls when initializing or when the "option" is called. Just changing the variable that was used for initialization does not affect the already initialized datepicker.

+21
source share

Are you talking about setting the maximum pick date?

 StartDate = new Date("March 20, 2010"); EndDate = new Date("March 21, 2010"); $("#datepicker").datepicker({ minDate: StartDate, maxDate: EndDate, defaultDate: StartDate }); 

Pay attention to maxDate? This will not allow you to choose any days after it ...

0
source share

The API documentation for the date picker seems to say that it should take a Date object, but I had this exact problem in the past, and that's how I solved it.

Pass the minDate offset instead of the date. You will need a function to accept the start date, add it to it, and then get the offset from today. Thus, you may have a function such as:

 function offsetFromToday( someDate ) { // clear time offset because we only want to take date into account someDate.setHours( 0 ); someDate.setMinutes( 0 ); // The number of milliseconds in one day var ONE_DAY = 1000 * 60 * 60 * 24; // Convert both dates to milliseconds someDate = someDate.getTime(); var today = new Date().getTime(); // Calculate the difference in milliseconds var difference = Math.abs( someDate - today ); // Convert back to days and return return Math.floor( (difference / ONE_DAY) + 1 ); } 

So you just need to get the start date the next day: StartDate.setDate( StartDate.getDate() + 1 ) or similar, and then pass it to this function to get the offset, and then pass it to minDate .

0
source share

All Articles