Der jQuery UI-Dialog ändert den Titel nach dem Rückruf


111

Ich möchte den Titel eines UI-Dialogs ändern, nachdem ich ein Formular in diesem UI-Dialog eingereicht habe. Also in der Callback-Funktion, nachdem loadich vorschlagen sollte, aber ich habe versucht und ohne Ergebnis gegoogelt.

Hat jemand eine Idee?

Antworten:


258

Verwenden von Dialogmethoden:

$('.selectorUsedToCreateTheDialog').dialog('option', 'title', 'My New title');

Oder direkt, aber hacky:

$("span.ui-dialog-title").text('My New Title'); 

Zum späteren Nachschlagen können Sie Google mit jQuery überspringen. Die jQuery-API beantwortet Ihre Fragen die meiste Zeit. In diesem Fall die Dialog-API-Seite . Für die Hauptbibliothek: http://api.jquery.com


8
Beachten Sie, dass die obige "hacky" -Version den Titel ALLER Dialoge auf der Seite ändert (falls Sie mehr als einen erstellt haben).
Camainc

1
Kann ich mehrere Optionen übergeben?
Themhz

3
@themis in der aktuellen Version gibt es eine .option()Methode, die auch ein Objekt nimmt, siehe options(options)hier: api.jqueryui.com/dialog/#method-option
Nick Craver

$ ("# dialog"). dialog ({autoOpen: false, show: {effect: "blind", dauer: 1000}, hide: {effect: "explode", dauer: 1000}, close: function () {; }, Titel: "test"}). dialog ("open");
WhiteWolfza

Da meine Antwort immer noch viel Aufmerksamkeit erhält, werde ich sie auch hier veröffentlichen. Stackoverflow.com/a/17745795/1315125
Igor L.

14

Ich habe eine einfachere Lösung gefunden:

$('#clickToCreate').live('click', function() {
     $('#yourDialogId')
         .dialog({
              title: "Set the title to Create"
         })
         .dialog('open'); 
});


$('#clickToEdit').live('click', function() {
     $('#yourDialogId')
         .dialog({
              title: "Set the title To Edit"
         })
         .dialog('open'); 
});

Hoffentlich hilft das!


3

Eine Erweiterung der hackigen Idee von Nick Craver, benutzerdefinierten HTML-Code in einen jquery-Dialogtitel einzufügen:

var newtitle= '<b>HTML TITLE</b>';
$(".selectorUsedToCreateTheDialog").parent().find("span.ui-dialog-title").html(newtitle);

Ich ziehe es vor, nicht hackig zu sein, wenn ich nicht muss, und es gibt bereits eine von jquery empfohlene Möglichkeit, HTML-Titel festzulegen: Überschreiben der _title-Methode. Es ist bereits in dieser SO Antwort behandelt: stackoverflow.com/questions/14488774/…
cincodenada

2

Ich habe versucht, das Ergebnis von Nick umzusetzen:

$('.selectorUsedToCreateTheDialog').dialog('option', 'title', 'My New title');

Aber das hat bei mir nicht funktioniert, weil ich mehrere Dialoge auf einer Seite hatte. In einer solchen Situation wird der Titel nur beim ersten Mal korrekt eingestellt. Der Versuch, Befehle zu heften, funktionierte nicht:

    $("#modal_popup").html(data);
    $("#modal_popup").dialog('option', 'title', 'My New Title');
    $("#modal_popup").dialog({ width: 950, height: 550);

Ich habe dies behoben, indem ich den Titeln zu den Argumenten der Javascript-Funktion jedes Dialogfelds auf der Seite hinzugefügt habe:

function show_popup1() {
    $("#modal_popup").html(data);
    $("#modal_popup").dialog({ width: 950, height: 550, title: 'Popup Title of my First Dialog'});
}

function show_popup2() {
    $("#modal_popup").html(data);
    $("#modal_popup").dialog({ width: 950, height: 550, title: 'Popup Title of my Other Dialog'});
}

0

Noch besser!

    jQuery( "#dialog" ).attr('title', 'Error');
    jQuery( "#dialog" ).text('You forgot to enter your first name');

In der ersten Zeile wird der Dialogtitel nicht geändert. Es gibt kein solches Attribut im jQuery-UI-Dialogfeld. Der zweite ändert den Inhalt des Dialogfelds selbst, aber das hat der Benutzer nicht gefragt. Und das setzt voraus, dass der idvon yoru Dialog ist #dialog.
Pere
Durch die Nutzung unserer Website bestätigen Sie, dass Sie unsere Cookie-Richtlinie und Datenschutzrichtlinie gelesen und verstanden haben.
Licensed under cc by-sa 3.0 with attribution required.