Use code to manipulate the behaviors of the todate and fromdate datepickers as follows:
1. Enable the todate datepicker only when there is a selected date in the fromdate datepicker.
2. Set the min date for the todate datepicker to the selected date of the fromdate datepicker.
For example:
<script>
$(function() {
var $from = $("#from");
var $to = $("#to");
$to.datepicker({disabled:true});
$from.datepicker({
onClose: function( selectedDate ) {
$to.datepicker( "option", "disabled", selectedDate == "" );
$to.val(selectedDate);
$to.datepicker( "option", "minDate", selectedDate );
}
});
$to.datepicker({
onClose: function( selectedDate ) {
$from.datepicker( "option", "maxDate", selectedDate );
}
});
});
</script>
</head>
<body>
<label for="from">From</label>
<input type="text" id="from" name="from">
<label for="to">to</label>
<input type="text" id="to" name="to">
</body>