3

I have developed a large "single page application" using jQuery and jQuery UI. As I load various sections in the app it creates jQuery UI widgets like dialogs or date pickers. They tend to hang around and cause some issues when I reload certain sections. I would like the ability to call a function that destroys all jQuery UI widgets that have been loaded and remove them from the DOM. Any solution to catch all of them? Thanks!

Jeremy
  • 1,023
  • 3
  • 18
  • 33

2 Answers2

7

In theory, it's easy enough to locate and destroy all widgets of a specific type on a page:

$(":ui-draggable").draggable("destroy");

So, it isn't unthinkable to create a loop around an array of widget types you know you're using, and delete every kind of widget on the list.

slashingweapon
  • 11,007
  • 4
  • 31
  • 50
2

Use remove() or detach() to clear the contents of your jquery UI widgets and here is the difference

remove() removes the matched elements from the DOM completely.

detach() is like remove(), but keeps the stored data and events associated with the matched elements.

Talha
  • 18,898
  • 8
  • 49
  • 66
  • You are calling remove() or detach() on the widgets but is this going to free all the memory used from the widgets internally or this will lead to a memory leak? - removing something from the DOM but not releasing its resources. – Ognyan Dimitrov Sep 23 '14 at 11:51