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?

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


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!


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);

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

0

Encore mieux!

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

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
En utilisant notre site, vous reconnaissez avoir lu et compris notre politique liée aux cookies et notre politique de confidentialité.
Licensed under cc by-sa 3.0 with attribution required.