Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

jQuery datepicker hide dates in between two months

Is there any way to hide the dates in between the two months when the option of numberOfMonths: 2.

I meant the first month's previous days and second month's next days to be enable and the days in between the two months will be hide.

Expected output will be looks like below:

The red colored part to be hide

Red colored part to be hide

Update: Those [Feb 23-28 and May 1-10] need to be grayed out only.

I want to hide the [Apr 1-5] in the March and [Mar 30-31] in the April.

Sample JsFiddle

like image 646
Arulkumar Avatar asked Dec 28 '25 18:12

Arulkumar


1 Answers

This one was giving me a hard time but I think you can do it with some CSS:

div.ui-datepicker-group-first td:not(.ui-datepicker-other-month) ~ td.ui-datepicker-other-month {
    visibility:hidden;
}
div.ui-datepicker-group-last td {
    visibility:hidden;
}
div.ui-datepicker-group-last td.ui-datepicker-other-month ~ td:not(.ui-datepicker-other-month), div.ui-datepicker-group-last td:not(.ui-datepicker-other-month), div.ui-datepicker-group-last td:not(.ui-datepicker-other-month) ~ td.ui-datepicker-other-month {
    visibility:visible;
}

jsFiddle example

like image 101
j08691 Avatar answered Jan 01 '26 21:01

j08691



Donate For Us

If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!