CODEWITHSUNDEEP
jqueryuser-interfacedatepickerdatetimepicker
Stanton
Stanton

Reputation: 1374

jQuery Datetimepicker - change minDateTime and maxDateTime on click?

I'm using the excellent Trent Richardson datetimepicker addon to the jQuery UI datepicker.

I have rows of data with two instances of the picker on each row, one for the start and one for the end time of a process. When my user clicks one, I'd like to reset the min or max datetime element based on the value of the other box - in other words, limit the end time based on the start time and the start time based on the end time (to prevent the user from starting after end or ending before start).

I invoke the datetimepicker like this:

$('.c_inbox_date').datetimepicker({
    hourGrid: 12,
    minuteGrid: 30,
    timeFormat: 'HHmm',
    showTimezone: false,
})

Here's the function I'm working on to reset the min and max times on the fly:

$('.c_inbox_date').click(function() {
    var this_col = $(this).closest('td').parent().children().index($(this).closest('td'));  
    if (this_col == 3) {
        var stop_time = $(this).closest('td').next('td').children('input').val();       
        $(this).datetimepicker({
            maxDateTime: stop_time
        })              
    } else {    
        var start_time = $(this).closest('td').prev('td').children('input').val();
        $(this).datetimepicker({
            minDateTime: new Date(start_time)
        })              
    }
})

Alert boxes in the function confirm that the start_time and stop_time variables contain the correct values. As you can see, I tried using 'new Date' to make sure the value was actually a date object, but that didn't work either.

Can anyone tell me why this doesn't work? Does datetimepicker allow this kind of on-the-fly change? Or is my syntax messed up? Any help is, as always, much appreciated.

Upvotes: 3

Views: 8919

Answers (2)

Antwan
Antwan

Reputation: 2125

Use both of them.

$('input')
  .datepicker('option', 'maxDate', new Date())
  .datetimepicker('option', 'maxDateTime', new Date());

The joys of reverse engineering...

Upvotes: 11

ether
ether

Reputation: 937

When setting the date back, with just the normal datepicker, I use this syntax: 

$( this ).datepicker( "option", "maxDate", new Date(your_date) );
//your_date is a string in the format: YYYY,MM,DD

I would assume that in your case, you could use: 

$( this ).datetimepicker( "option", "maxDateTime", new Date(your_date) );
//your_date is a string in the format: YYYY,MM,DD,HH,II

Upvotes: 0

Related Questions