jquery datetime picker set minDate dynamic

Question

I guys i\'m using a datetimepicker by trentrichardson.com.

I have a form with two input fields : from and to and i want to be able

Answer 1

Please use latest version of bootstrap.min.js

$("#from").datepicker( {
        format: "dd-mm-yyyy",
        endDate: '+0d',
        autoclose: true,
    }).on('changeDate', function(e) {
    
        var oldDate = $('.datepicker-current').val();
    
        $('#to').data('datepicker').setEndDate(oldDate);
    
    });

Answer 2

you can set and get minDate dynamically with setter and getter:

//getter
var minDate = $( ".selector" ).datepicker( "option", "minDate" );
//setter
$( ".selector" ).datepicker( "option", "minDate", new Date(2007, 1 - 1, 1) );

explained here

Answer 3

luca: A small addition to your answer...

Using the function you suggested the time component is ignored the first time the datetimepicker is displayed. If you close the datetimepicker and reopen it again, the time component mysteriously reappears. I'm not quite sure what is causing this, but it can be fixed with a bit of a hack:

function setMinMaxDate ( element )
{
    // Store current date - setting max/min date seems to destroy time component
    var val = $(element).val();

    if (element.id == 'endDate') 
    {     
        var x=$('#startDate').datetimepicker("getDate");
        $( element ).datetimepicker( "option", "minDate",x ); 
    } 
    else if (element.id == 'startDate') 
    {     
        var x=$('#endDate').datetimepicker("getDate");
        $( element ).datetimepicker( "option", "maxDate",x ); 
    }

    // Restore date
    $(element).val(val);
}

Answer 4

This worked for me

<input type="date" name="cname" value=""  min="<?php echo date("Y-m-d") ?>"/>

Answer 5

You can restrict the datepicker range.

But you want to set this range on creation of the datepicker on the "from". I made you a demo which seems to work OK as far as I understand the question.

Answer 6

If you have two textboxes with corresponding IDs from and to and you want the minDate of to to be the selected date of from then do the following:

$("#from").datepicker({
    minDate: 0, // to disable past dates (skip if not needed)
    onClose: function(selectedDate) {
        // Set the minDate of 'to' as the selectedDate of 'from'
        $("#to").datepicker("option", "minDate", selectedDate);
    }
});

$("#to").datepicker();