jquery datepicker not hiding on ios when clicked on background

Question

I have a small problem with the jquery datepicker and ios.

When clicked on the input field the datepicker appears as expected. But when clicked on the background (withou

Answer 1

I know this response is a bit late, but I just ran across this same issue when testing on my iPhone. I think this may be a longstanding jquery ui bug.

See this ticket detailing the issue: http://bugs.jqueryui.com/ticket/9308

And this page detailing the root cause and possible workarounds: https://developer.mozilla.org/en-US/docs/Web/Events/click#Safari_Mobile

Safari Mobile 7.0+ (and likely earlier versions too) suffers from a bug where click events aren't fired on elements that aren't typically interactive (e.g. ) and which also don't have event listeners directly attached to the elements themselves (i.e. event delegation is being used). See this live example for a demonstration. See also Safari's docs on making elements clickable and the definition of "clickable element".

Known workarounds for this bug:

• Set cursor: pointer; on the element or any of its ancestors.

• Add a dummy onclick="" attribute to the element or any of its ancestors up to but not including .

• Use a typically interactive element (e.g. ) instead instead of one that isn't typically interactive (e.g.

  ).

• Stop using click event delegation.