Изменение заголовка диалогового окна jQuery-UI с помощью функции другого диалогового окна

Question

Почему не появляется заголовок второго диалогового окна jQuery-UI при извлечении. В первом диалоговом окне я изменяю заголовок окна с помощью следующего .attr("title", "Confirm") - оно меняет заголовок первого поля на «Подтвердить», как и должно быть. Теперь, когда появляется второе окно, оно должно изменить заголовок на «Сообщение», поскольку то же самое проделано для второго окна - .attr("title", "Message"). Правильно? Но это не так. Это сохранить название до. Однако сообщение меняется так, как должно быть. Я тестировал в IE8, Chrome и FF3.6.

<div id="dialog-confirm" title=""></div> <- это HTML-код перед функционированием jQuery. </p>

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

Спасибо за помощь, если вы решите помочь.

Answer 1

jQuery UI Dialog также предоставляет метод «option», который позволяет вам изменять опции в диалоговом окне без повторной настройки всего этого. Поэтому, если вы просто хотите снова показать то же самое диалоговое окно с новым заголовком, вы можете использовать следующее:

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

См. Документацию jQuery в диалоге "опция" .

Answer 2

Не пройдя весь ваш код. Я предполагаю, что $('#dialog-confirm').attr("title", "Message"); не работает во второй раз, потому что jQuery UI Dialog уже внес изменения в реальный DOM. Таким образом, изменение атрибута title в div ничего не делает. Поскольку фактический заголовок, вероятно, имеет вид div / p или аналогичный, сгенерированный диалогом jQuery UI.

Ваш второй звонок $('#dialog-confirm').dialog({..}) просто обновляет существующий диалог новыми опциями.

Проверяя документацию по JQuery UI Dialog, вы должны были заметить, что вы можете просто передать опцию title. Так что второй раз вместо

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

просто используйте

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

Answer 3

Это сработало для меня (я использовал firebug, чтобы получить имя элемента) ..

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

Answer 4

Вы можете установить заголовок диалога по идентификатору, 100% рабочий пример кода ниже

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