Saturday, 7 September 2013

Bind and Destroy

Bind and Destroy

I have run into a subtle issue in a large jQuery UI webapp that I am
currently developing. The app uses a large number of popup dialogs that by
and large are created the one time and then reopened on several occasions
during the lifetime of the event. Most of the dialogs have jQuery UI
button controls whose "click" event I bind to from the dialog's create:
event. No problems thus far.
However, there was one dialog where I had inadvertently used
dialog('destroy');
in place of
dialog('close');
as always with button click event binding in the dialog's create: event.
This resulted in a curious issue which it took me a while to track down -
apparently each time the dialog was reopened the create: code bound a new
instance of the click event to the buttons in the dialog. The result
First time - button click code executed one time
Second time - button click code executed two times
...
I have now realized what was going on and corrected my code. However, this
leaves me with both a doubt and a question
What are the pros and cons of creating a jQuery UI dialog once and then
reopening it as opposed to creating and destroying it each time?
Why does this happen? Does it make any sense to be able to bind n times
over to the same event?

No comments:

Post a Comment