jQuery ui dialog change le titre après load-callback

111

J'aime changer le titre d'une boîte de dialogue de l'interface utilisateur après avoir soumis un formulaire dans cette boîte de dialogue de l'interface utilisateur. Donc, dans la fonction de rappel après loadje devrais suggérer, mais j'ai essayé et googlé sans résultat.

Quelqu'un at-il une idée?

javascript jquery jquery-ui jquery-dialog Guido Lemmens 2
la source

Réponses:

258

Utilisation des méthodes de dialogue:

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

Ou directement, hacky cependant:

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

Pour référence future, vous pouvez ignorer google avec jQuery. L'API jQuery répondra à vos questions la plupart du temps. Dans ce cas, la page Dialog API . Pour la bibliothèque principale: http://api.jquery.com

Nick Craver
la source
8
Attention, la version "hacky" ci-dessus modifiera le titre de TOUTES les boîtes de dialogue de la page (au cas où vous en auriez créé plusieurs).
camainc
1
puis-je passer plusieurs options?
themhz
3
@themis dans la version actuelle, il existe une .option()méthode qui prend également un objet, voir options(options)ici: api.jqueryui.com/dialog/#method-option
Nick Craver
$ ("# dialog"). dialog ({autoOpen: false, show: {effect: "blind", duration: 1000}, hide: {effect: "explode", duration: 1000}, close: function () {; }, titre: "test"}). dialog ("open");
WhiteWolfza
Puisque ma réponse retient toujours beaucoup l'attention, je la posterai également ici .. stackoverflow.com/a/17745795/1315125
Igor L.
14

J'ai trouvé une solution plus simple:

$('#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'); 
});

J'espère que cela pourra aider!

rêveur de travail
la source
3

Une amélioration de l'idée hacky par Nick Craver de mettre du HTML personnalisé dans un titre de dialogue jquery:

var newtitle= '<b>HTML TITLE</b>';
$(".selectorUsedToCreateTheDialog").parent().find("span.ui-dialog-title").html(newtitle);
storvas
la source
Je préfère ne pas être piraté quand je n'ai pas à le faire, et il existe déjà un moyen approuvé par jquery de définir des titres HTML: remplacer la méthode _title. C'est déjà couvert dans cette réponse SO: stackoverflow.com/questions/14488774/…
cincodenada
2

J'ai essayé d'implémenter le résultat de Nick qui est:

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

Mais cela n'a pas fonctionné pour moi car j'avais plusieurs dialogues sur une page. Dans une telle situation, le titre ne sera corrigé que la première fois. La tentative d'agrafage des commandes n'a pas fonctionné:

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

J'ai corrigé cela en ajoutant le titre aux arguments de la fonction javascript de chaque boîte de dialogue de la page:

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'});
}
Tim B.
la source
0

Encore mieux!

    jQuery( "#dialog" ).attr('title', 'Error');
    jQuery( "#dialog" ).text('You forgot to enter your first name');
user4629979
la source
La première ligne ne changera pas le titre de la boîte de dialogue. Il n'y a pas un tel attribut dans la boîte de dialogue de l'interface utilisateur jQuery. Le second modifiera le contenu de la boîte de dialogue lui-même, mais ce n'est pas ce que l'utilisateur demandait. Et c'est en supposant que le iddialogue de of yoru est #dialog.
Pere