Recientemente me encontré con una situación en la que estaba un poco confundido acerca de qué técnica debo usar cuando trato con JQueryUI Modal Dialog.Cuadro de diálogo modal JQuery: ¿destruir o cerrar?
Tengo una función: ClearDay (weekID, ltDayID). Actualmente este es el responsable de crear un diálogo con dos botones: ok y cancelar.
ok disparará una llamada ajax, pasando weekID y ltDayID al servidor.
cancelar vaciar el cuadro de diálogo div y llamar a .dialog('destroy')
en el div de destino.
Mi pregunta es: ¿qué siguiente enfoque debo usar?
Destruir/Re-Crear diálogo en cada llamada - para que pueda pasar parámetros a la llamada Ajax y sólo tienen una div para todos de diálogo en el marcado
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');
}
});
}
Crear el cuadro de diálogo sólo una vez, pero que tiene uno div para cada cuadro de diálogo en el marcado, utilizando Close, y que pasa en los valores directamente utilizando Jquery Selectores
$(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');
}
Saludos,
James
2nd one también hará que jquery deje todo el contenido del código html de un cuadro de diálogo, que se agregó al crear el diálogo sobre la marcha con todos los oyentes activados. Eso está haciendo una segunda solución cuando, usando muchos diálogos, incluso más lento ... – elon