jQuery: dialog nicht eröffnet zweiten mal richtig

Den ich erstellt habe einen jQuery-dialog. Unten ist die Ajax-Funktion, wo ich die erstellte.

$.ajax({
    url: "/StaffManageCertifications/GetExamCodesAndCategory/",
    type: "Post",
    datatype: "html",
    success: function (data) {
        debugger;
        $('#divExamCodesCategory').html(data);
        $("#divExamCodesCategory").dialog({
            autoOpen: false,
            width: 700,
            height: 610,
            modal: true,
            resizable: false,
            draggable: true,
            title: 'Add Exam Code/Category'
        });
        $("#divExamCodesCategory").dialog("open");
        $('a.ui-dialog-titlebar-close').remove();
        $('#divProcessImage').css({
            "display": "none"
        });
    },
    error: function (req, status, error) {
        ErrorMessageStaff(req.responseText);
        $('#screen').css({
            "display": "block",
            "width": "",
            "height": ""
        });
        $('#divProcessImage').css({
            "display": "none"
        });
    }
});

Nun, ich habe zwei Schaltflächen(Ok und Abbrechen) auf, dass div = divExamCodesCategory.

geschrieben und folgende Zeile von code zu zerstören dieses Dialogfeld jedes mal, wenn ich es schließen.

$("#divExamCodesCategory").dialog("destroy");

nun, wenn ich es öffnen zum zweiten mal,
auf den ersten Klick - it doesn ' T show Dialogfeld.
auf den zweiten Klick - es tut dialog anzeigen, aber ohne die Daten. leeres Dialogfeld.

Auch, es kommt nicht in der Mitte des Bildschirms. Es lässt sich an der Unterseite des Bildschirms. unten ist die position Stil für diesen dialog.

.ui-dialog {
    padding: 0em !important;
    position: fixed !important;
}

Jede Hilfe dankbar.

Dank.

Können Sie reproduzieren Sie es mit einem jsFiddle.net ?
Schließen Sie den Dialog, anstatt Sie zu zerstören
Ich kann mal versuchen..Danke für die schnelle Antwort.
James, ich versuchte das auch. Aber immer noch nicht funktioniert. Ich habe versucht, entfernen Sie auch. Dank
Ich habe diese Geige - konnte ich nicht machen, es arbeiten aber alle den code in das. Bitte überprüfen Sie diese. - jsfiddle.net/Q35AD
Wie verwalten Sie die Schaltfläche Abbrechen? Das ist für mich arbeiten. Werfen Sie einen Blick auf dieses Geige
Anu, könnte es das problem mit den Ajax-call. Erstellt habe ich dieses Dialogfeld auf, in, dass , und Sie haben es getan im Dokument.bereit. Ich bin mir nicht sicher

InformationsquelleAutor Mittal Patel | 2013-07-12

jquery

5

Wenn Sie beabsichtigen, Sie zu zerstören, den dialog jedes mal ist es geschlossen, das getan werden muss, um in das Dialogfeld schließen handler:
```
$(...).dialog({
    ...,
    close: function() {
        $(this).dialog('destroy');
    }
});
```
Wie es steht, wenn Ihr (unshown) destroy Gespräch sofort nach dieser AJAX-Aufruf, wie du es beschrieben hast wirst eigentlich sofort geschehen, weil der AJAX-Aufruf asynchrone und endet sofort.

p.s. anstelle der Verwendung von $.css({'display': 'none'}), verwenden Sie einfach .hide()

InformationsquelleAutor Alnitak
2

Fand ich unterhalb Lösung für dieses problem: hoffe, dies hilft jemand.. 🙂

Geschafft, das Problem zu lösen, das Problem war, dass das Programm wiederholt das erstellen von unnötigen DIVS, wenn $("import_box_dialog").dialog() aufgerufen wurde. Und da der $ - operator gibt u alle div-s, die mit einem bestimmten Zustand, d.h. die ID, in diesem Fall, damit der Inhalt nicht sichtbar, was ich denke, machte es verwirrt, es gibt zwei Möglichkeiten, es zu lösen:

Entfernen der Div-manuell durch den Aufruf

$("import_box_dialog").remove()

Wäre dies jedoch entfernen Sie alle anderen Div ' s in das Dialogfeld div
Verwenden Sie eine variable, um die Spur der div verwendet, die für die dialog-box, da ich mich mit jquery Klassen, die ich es für benutze die static-variable. Somit ist dieser Weg, verfolgt es den dialog, und immer den dialog erstellt, auf die gleiche div.

Ich nehme an, jquery, gilt eine Menge von class-Stile, bei denen es nicht eindeutig ist, bei der Auswahl des richtigen div-Element, und ich denke, mit einer statischen Variablen löst.

InformationsquelleAutor Mittal Patel
0

Ersten. Sie müssen diesen code außerhalb der ajax-Aufruf.
```
$("#divExamCodesCategory").dialog({ autoOpen: false,
    width: 700,
    height: 610,
    modal: true,
    resizable: false,
    draggable: true,
    title: 'Add Exam Code/Category'

});
```
Es in dieser statt.
```
$(document).ready(function() {
    $("#divExamCodesCategory").dialog({ autoOpen: false,
        width: 700,
        height: 610,
        modal: true,
        resizable: false,
        draggable: true,
        title: 'Add Exam Code/Category'
    });
});
```
Ändern Sie den Erfolg von call-in:
```
success: function (data) {
    debugger;
    $('#divExamCodesCategory').html(data);
    $("#divExamCodesCategory").dialog("open");
    $('a.ui-dialog-titlebar-close').remove();
    $('#divProcessImage').css({ "display": "none" });
},
```
Und wenn Sie schließen möchten. Zerstören Sie nicht das Objekt. Nur schließen Sie es
```
$("#divExamCodesCategory").dialog("close");
```
Für die css. Nicht fixiert die position des dialogs. Es ist standardmäßig auf dem Bildschirm zentrieren. Vielleicht möchten Sie die Höhe und Breite, aber lassen Sie die position.
- Ich bin nicht einverstanden, es ist völlig akzeptabel, zu erstellen und zu zerstören dialog-Boxen auf der fly - der overhead ist vernachlässigbar, und es erfordert weniger Staat aufrecht zu erhalten.
- Ich kann dies aus der Ajax-Aufruf, wie bekomme ich Daten aus der Datenbank zu füllen, werden in diesem Dialogfeld. Also ich bin beim aufrufen dieser dialog auf Erfolg, die Daten. Gibt es einen Grund, nicht zu platzieren, dass in Ajax ?
InformationsquelleAutor Frederick Lasmana

(Erstellen einer dialog-und wiederverwendet) ist guter Ansatz und vice-versa.
//erstellen Sie neue dialog jedes mal,überprüfen Sie, ob Sie bereits erstellt oder nicht
wenn nicht, dann anlegen und öffnen else öffnen Sie die zuvor erstellte dialog

 if (!$("#divExamCodesCategory").hasClass('ui-dialog')) { //check if alredy created
//it is not initialized yet
        $("#divExamCodesCategory").dialog({ autoOpen: false,
                width: 700,
                height: 610,
                modal: true,
                resizable: false,
                draggable: true,
                title: 'Add Exam Code/Category'

            });
        //initialized
    }
//open dialog
    $("#divExamCodesCategory").dialog("open");//after creation

die OP ist, es zu zerstören jederzeit

InformationsquelleAutor vikrant singh

Schreibe einen Kommentar

Du musst angemeldet sein, um einen Kommentar abzugeben.