Changer le titre de la boîte de dialogue jQuery-UI avec dans une autre fonction de la boîte de dialogue - jquery, html, jquery-ui

Pourquoi le "deuxième" de la boîte de dialogue jQuery-UI ne change-t-il pas lorsqu'il apparaît? La première boîte de dialogue, je change le titre de la boîte en utilisant ce qui suit .attr("title", "Confirm") - il change le titre de la première case en "Confirmer", comme il aurait dû. Maintenant, lorsque la deuxième boîte apparaît, le titre doit être remplacé par "Message", car la même chose a été faite pour la deuxième boîte - .attr("title", "Message"). Droite? Mais ce n'est pas le cas. Il garde le titre d'avant. Cependant, le message change comme il aurait dû. J'ai testé dans IE8, Chrome et FF3.6.

<div id="dialog-confirm" title=""></div> <- Ceci est le html avant les fonctions jQuery.

Javascript / jQuery

$("#userDelete").click(function() {
$(function() {
var dialogIcon = "<span class="ui-icon ui-icon-alert"></span>";
var dialogMessage = dialogIcon + "Are you sure you want to delete?";
$("#dialog-confirm").attr("title", "Confirm").html(dialogMessage).dialog({
resizable: false,
height:    125,
width:     300,
modal:     true,
buttons:  {
"Delete": function() {
$(this).dialog("close");
$.post("user_ajax.php", {action: "delete",
aId: $("[name=aId]").val()
}, function(data) {
if(data.success){
var dialogIcon = "<span class="ui-icon ui-icon-info"></span>";
var dialogMessage = dialogIcon + data.message;
$("#dialog-confirm").attr("title", "Message");
$("#dialog-confirm").html(dialogMessage);
$("#dialog-confirm").dialog({
resizable: false,
height:    125,
width:     300,
modal:     true,
buttons:  {
"Okay": function() {
$(this).dialog("close");
var url = $_httpaddress + "admin/index.php"
$(location).attr("href",url);
} // End of Okay Button Function
} //--- End of Dialog Button Script
});//--- End of Dialog Function
} else {
$_messageConsole.slideDown();
$_messageConsole.html(data.message);
}
}, "json");
}, //--- End of Delete Button Function
"Cancel": function() {
$(this).dialog("close");
} //--- End of Cancel Button Function
} //--- End of Dialog Button Script
}); //--- End of Dialog Script
}); //--- End of Dialog Function
return false;
});

Merci pour votre assistant, si vous choisissez d'aider.

Réponses:

14 pour la réponse № 1

Sans passer par tout votre code. je suppose $("#dialog-confirm").attr("title", "Message"); ne fonctionne pas la deuxième fois car la boîte de dialogue jQuery UI a déjà apporté des modifications au DOM réel. title attribut du div ne fait rien. Comme le titre réel est probablement un peu div/p ou similaire généré par la boîte de dialogue jQuery UI.

Votre deuxième appel à vous $("#dialog-confirm").dialog({..}) met simplement à jour une boîte de dialogue existante avec de nouvelles options.

En vérifiant la documentation de la boîte de dialogue jQuery UI, vous devriez avoir noté que vous pouvez simplement passer une option de titre. Donc, la deuxième fois au lieu de

$("#dialog-confirm").attr("title", "Message");
$("#dialog-confirm").html(dialogMessage);
$("#dialog-confirm").dialog({
resizable: false,
height:    125,
width:     300,
...
});

juste utiliser

$("#dialog-confirm").html(dialogMessage);
$("#dialog-confirm").dialog({
resizable: false,
height:    125,
width:     300,
...
"title", "Message" //NEW!
});

---

20 pour la réponse № 2

jQuery UI Dialog fournit également une méthode "option"qui vous permet de changer une option dans la boîte de dialogue sans reconfigurer le tout. Donc, si vous souhaitez simplement afficher à nouveau la même boîte de dialogue avec un nouveau titre, vous pouvez utiliser ce qui suit:

$("#dialog-confirm").dialog("option", "title", "Message");
$("#dialog-confirm").dialog("open");

Voir le Documentation jQuery sur "Option" de dialogue.

---

1 pour la réponse № 3

Cela a fonctionné pour moi (j'ai utilisé Firebug pour obtenir le nom de l'élément) ..

document.getElementById("ui-dialog-title-"+formname).innerHTML = "New title";

---

0 pour la réponse № 4

Vous pouvez définir le titre de la boîte de dialogue par identifiant, code d'exemple 100% fonctionnel ci-dessous

$( "#json_box" ).dialog({minHeight: 433,minWidth:550,"title":"Json to Template"});

---