Loading...

Search jQuery

Search

jQuery Forum

Using jQuery UI

How do I restrict the start date and the end date to the same month?

in Using jQuery UI • 4 months ago

<script type="text/javascript">
$(function() {
$( "#from" ).datepicker({
defaultDate: "+1w",
numberOfMonths: 1,
onSelect: function( selectedDate ) {
$( "#to" ).datepicker( "option", "minDate", selectedDate );
}
});
$( "#to" ).datepicker({
defaultDate: "+1w",
numberOfMonths: 1,
onSelect: function( selectedDate ) {
$( "#from" ).datepicker( "option", "maxDate", selectedDate );
}
});
$( "input[type=submit]" )
.button()
});
</script>

1

Replies(2)

kbwood.au

Re: How do I restrict the start date and the end date to the same month?

4 months ago

Something like this:

$(function() {
$.datepicker.setDefaults({defaultDate: '+1w'});
$('#from').datepicker({onSelect: function(dateStr) {
var date = $(this).datepicker('getDate');
var endMonth = null;
if (date) {
endMonth = new Date(date.getTime());
endMonth.setMonth(endMonth.getMonth() + 1);
endMonth.setDate(0);
}
$('#to').datepicker('option', {minDate: date, maxDate: endMonth});
}});
$('#to').datepicker({onSelect: function(dateStr) {
var date = $(this).datepicker('getDate');
var startMonth = null;
if (date) {
startMonth = new Date(date.getTime());
startMonth.setDate(1);
}
$('#from').datepicker('option', {minDate: startMonth, maxDate: date});
}});
});

Re: How do I restrict the start date and the end date to the same month?

4 months ago

Disregard this comment. Working on another problem related to this so might need some further help.