I often find the need to create datepickers that do not allow past dates and/or only allow workdays. To simplify this process, I just add a combination of three classes to elements and then make a short call at my page load.
The classes are:
datepicker : to create the date picker
minToday : to not allow past dates
workdayOnly : to only allow workdays
Then the code is:
$(".datepicker").datepicker().filter(".minToday").datepicker("option", "minDate", 0) //no less than today
I have noticed an issue with the accordion height when it is inside of a tab. It seems the accordion content does not display. This only happens on the non-selected tab at init time (default is zero). Also, it only seems to happen when the tabs are initialized prior to the accordion.
I have all my input fields on a form the same with for symmetry. I would like the datepicker associated with some of them to be the same with as well. Does anyone know of a good way to do this?
One issue that I dealt with is constraining a user to pick a date from a datepicker and not allow any input into the input field. I'm aware of the constrainInput option, but this allows a user to still enter any amount of valid characters. For example, a user could type 12///333///444/555/666 in the field and it would stay there on blur.
There are a couple of work arounds but I am looking for help/suggestions.
One option is to add a read only option to the input. This works great, but it turns the input gray in some browsers making it appear disabled to users. I try to overcome this with css but seems a hassle and I have validated it in many browsers/OSs.
Another option is to return false on the key up/down/press event. This is tricky because of cross browser support of these events. Also, without filtering, you are preventing all keys when some (esc, tab, enter, etc.) should likely be allowed.
Any suggestions??? I think this should really be the default behavior of the datepicker.