JQuery Modal Dialog - Destroy or Close?

To be honest, I'm not sure. However you could use a javascript profiler to measure the time it takes to execute either way.

Up vote 2 down vote favorite share g+ share fb share tw.

I've recently come across a situation where I've been a bit confused about which technique I should use when dealing with JQueryUI Modal Dialog's. I've got a function: ClearDay(weekID, ltDayID). Currently this is responsible for creating a dialog with two buttons: ok and cancel.

Ok will fire an ajax call, passing weekID and ltDayID to the server. Cancel will empty the dialog's div and call . Dialog('destroy') on the target div.

My question is: which following approach should I use? Destroy/Re-Create Dialog on every call - so that I can pass parameters to the ajax call and only have one div for all dialog's in the markup function ClearDay(weekID, ltDayID) { $('#modalDialog'). Dialog({ autoOpen: true, width: 300, title: 'Confirm Delete', modal: true, buttons: { text: 'ok', click: function (e) { $(this).

Dialog('close'); $. Ajax({ url: '/Shift/ClearDay', type: 'POST', cache: false, data: { shiftWeekID: weekID, shiftLtDayID: ltDayID }, success: function (result) { LoadShiftPattern(function (result) { $('#weekContainer'). Html(result); SelectLastUsedField(); }); } }); } }, { text: 'cancel', click: function (e) { $('#errorList').empty(); $(this).

Dialog('close'); } }, open: function (e) { $(this). Html("Clicking ok will cause this day to be deleted. "); }, close: function (e) { $(this).empty(); $(this).

Dialog('destroy'); } }); } Create the dialog only once, but having one div for each dialog in the markup, using Close, and passing in the values directly using Jquery Selectors $(function() { $('#confirmDeleteDialog'). Dialog({ autoOpen: false, width: 300, title: 'Confirm Delete', modal: true, buttons: { text: 'ok', click: function (e) { $(this). Dialog('close'); $.

Ajax({ url: '/Shift/ClearDay', type: 'POST', cache: false, data: { shiftWeekID: $('#weekIDInput').val(), shiftLtDayID: $('#dayIDInput').val()}, success: function (result) { LoadShiftPattern(function (result) { $('#weekContainer'). Html(result); SelectLastUsedField(); }); } }); } }, { text: 'cancel', click: function (e) { $('#errorList').empty(); $(this). Dialog('close'); } }, open: function (e) { $(this).

Html("Clicking ok will cause this day to be deleted. "); } }); } function ClearDay() { $('#confirmDeleteDialog'). Dialog('open'); } Cheers, James jquery jquery-ui modal-dialog link|improve this question edited Apr 15 '11 at 8:23 asked Apr 15 '11 at 8:17James305115 100% accept rate.

To be honest, I'm not sure. However you could use a javascript profiler to measure the time it takes to execute either way. Here is a link to a mini-guide for the javascript profiler in Google Chrome's developer tools code.google.com/chrome/devtools/docs/pro... I'd suggest that the 2nd option would be slower, as I'm guessing the selectors in "data" would need to be evaluated and therefore making it slower.

However, this is going to depend on how many times the dialogue is going to be opened / closed. As I'm guessing destroying and recreating will be slow (well in the blink of an eye - but perhaps a little bit slower). The first seems like a simpler implementation, so if performance doesn't seem to be an issue - perhaps just choose the simpler of the two.

It depends on how many elements you are using the function ClearDay. If the no of elements is large then the second approach ie. (Creating one dialog and reusing it) is good approach and vice-versa.

I feel that having 1 div always will be useful for u. It will avoid confusion.

I cant really gove you an answer,but what I can give you is a way to a solution, that is you have to find the anglde that you relate to or peaks your interest. A good paper is one that people get drawn into because it reaches them ln some way.As for me WW11 to me, I think of the holocaust and the effect it had on the survivors, their families and those who stood by and did nothing until it was too late.