Jquery-ui Datepicker Only Appears After Textbox Focused Second Time

For some reason, when I load the partial and I click the textbox to bring up the datepicker I have to click out of the textbox then click back in the textbox before the datepicker

Solution 1:

Calling

$("#event_start_at_date").datepicker({ dateFormat: "yy-mm-dd" })

doesn't open the datepicker, it just binds the datepicker to that element, which means that it will then react to clicks and open the datepicker.

You should bind datepickers to the elements when the DOM is loaded, not in a click handler.