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

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

<div id="dialog-confirm" title=""></div> < - Это html перед функциями 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; 
});

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

Ответ 1

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

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

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

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

Ответ 2

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

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

См. документацию jQuery на странице "Диалог" .

Ответ 3

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

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

Ответ 4

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

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