JQuery UI Datepicker loses focus when selecting date with mouse

Viewed 53457

I am using JQuery ui with datepicker and when a user tabs on to a field, they appropriately get the calendar pop up.

  1. User tabs (via key onto field
  2. User selects date with mouse click
  3. User tabs
  4. Tabindex starts over at one (at the beginning of form)

Here is code. (May also have the tab index set)

<input type="text" name="demo" />
<input type="text" class="date" />

The jquery code is:

$(".date").datepicker();

Any suggestions on how I might go about solving this issue (bonus to shortest solution)?

10 Answers

I have added an empty href tag next to the datepicker input control and focus onto it in the onClose event handler. This solved my problem of the focus shifting all the way to the top of the page when the calendar was closed. I am using that href tag to display error messages; therefore it serves two purposes for me.

Related