Wenn eine Ajax-Operation fehlschlägt, erstelle ich ein neues Div mit den Fehlern und zeige es als Dialog an. Wenn der Dialog geschlossen ist, möchte ich das div komplett löschen und wieder entfernen. Wie kann ich das machen? Mein Code sieht im Moment so aus:
$('<div>We failed</div>')
.dialog(
{
title: 'Error',
close: function(event, ui)
{
$(this).destroy().remove();
}
});
Wenn ich das ausführen, wird das Dialogfeld korrekt angezeigt, aber wenn ich es schließe, ist das Dialogfeld immer noch in der HTML-Datei sichtbar (mit FireBug). Was fehlt mir hier? Etwas was ich vergessen habe
Update: Ich habe gerade bemerkt, dass mein Code einen Fehler in der Firebug-Konsole anzeigt.
$ (this) .destroy ist keine Funktion
Kann mir jemand helfen?
Update: Wenn ich stattdessen nur $(this).remove()
mache, wird das Element aus der HTML-Datei entfernt. Aber ist es vollständig aus dem DOM entfernt? Oder muss ich diese Zerstörungsfunktion irgendwie zuerst aufrufen?
$(this).dialog('destroy').remove()
Dies zerstört den Dialog und entfernt dann das Div, das den Dialog vollständig gehostet hat, vollständig aus dem DOM
Warum möchten Sie es entfernen?
Wenn Sie verhindern möchten, dass mehrere Instanzen erstellt werden, gehen Sie wie folgt vor:.
$('#myDialog')
.dialog(
{
title: 'Error',
close: function(event, ui)
{
$(this).dialog('close');
}
});
Und wenn der Fehler auftritt, würden Sie tun ...
$('#myDialog').html("Ooops.");
$('#myDialog').dialog('open');
$(dialogElement).empty();
$(dialogElement).remove();
das behebt es für echt
Eine hässliche Lösung, die für mich wie ein Zauber wirkt:
$("#mydialog").dialog(
open: function(){
$('div.ui-widget-overlay').hide();
$("div.ui-dialog").not(':first').remove();
}
});
Sie können verwenden
$(dialogElement).empty();
$(dialogElement).remove();
Das ist für mich gearbeitet
$('<div>We failed</div>')
.dialog(
{
title: 'Error',
close: function(event, ui)
{
$(this).dialog("close");
$(this).remove();
}
});
Prost!
PS: Ich hatte ein etwas ähnliches Problem und der obige Ansatz hat es gelöst.
Ich verwende diese Funktion in allen meinen js-Projekten
Sie nennen es: hideAndResetModals ("# IdModalDialog")
Sie definieren, ob:
function hideAndResetModals(modalID)
{
$(modalID).modal('hide');
clearValidation(modalID); //You implement it if you need it. If not, you can remote this line
$(modalID).on('hidden.bs.modal', function ()
{
$(modalID).find('form').trigger('reset');
});
}