jQuery UI tips and tricks #76

davydotcom opened this Issue Oct 5, 2012 · 9 comments

4 participants


Just leaving some notes for some things i noticed when using jQuery ui components (particularly the datepicker)..

When a page has changed, the .datepicker has not reinitialized because it doesnt check to see if its datePicker div has been removed from the dom, but it has.

To correct this you can do something like this...

jQuery.datepicker.dpDiv.appendTo( jQuery('body') );

I updated this solution per @rpflorence ... thanks for the catch.

dhh commented Oct 5, 2012

How is the datepicker currently initialized? Using jQuery.ready?


The jQuery datepicker initializes on the first call to $.fn.datepicker, and then sets a global variable to true.


@davydotcom's solution will bind the mousedown event with every page load, which is terrible.

You just need to append the element to the document again:

jQuery.datepicker.dpDiv.appendTo( jQuery('body') );

... or open tickets with jQuery UI (and everybody else in the world) to jump hoops to decide if their widgets have been blown away or not :P


@davydotcom, nice, they have a pull request open too:

Bug tracker


pull request


@dhh dhh closed this Nov 26, 2012

I know that this ticket is closed but I solved this problem in different way:

$(document).on 'page:change', ->
  $.datepicker.initialized = false

It works like a charm.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment