使用另一个对话框的功能更改 jQuery-UI 对话框的标题

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/2443956/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-26 13:31:56  来源:igfitidea点击:

Changing the title of jQuery-UI dialog-box with in another dialog-box's function

jqueryhtmljquery-ui

提问by SgtOJ

Why doesn't doesn't the second jQuery-UI dialog box title change when popped. The first dialog box I change the title of the box with using the following .attr("title", "Confirm")-- it change the title of the first box to 'Confirm', like it should have. Now when the second box pops up it should change the title to 'Message' since did the same thing for the second box -- .attr("title", "Message"). Right? But it doesnt. It keep the title from before. However, the message change like it should have. I have tested in IE8, Chrome, and FF3.6.

为什么第二个 jQuery-UI 对话框标题在弹出时不改变。第一个对话框我使用以下.attr("title", "Confirm")更改框的标题 - 它将第一个框的标题更改为“确认”,就像它应该有的那样。现在,当第二个框弹出时,它应该将标题更改为“消息”,因为对第二个框做了同样的事情 -- .attr("title", "Message")。对?但它没有。它保留了以前的标题。但是,消息发生了变化。我已经在 IE8、Chrome 和 FF3.6 中进行了测试。

<div id="dialog-confirm" title=""></div><-- This is the html before jQuery functions.

<div id="dialog-confirm" title=""></div><-- 这是 jQuery 函数之前的 html。

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

Thank you for you assistant, if you choose to help.

感谢您的助手,如果您选择提供帮助。

回答by Sazerac

jQuery UI Dialog also provides a method "option" that allows you to change an option on the dialog without re-configuring the whole thing. So if you just want to show the same dialog again with a new title you can use the following:

jQuery UI Dialog 还提供了一个方法“选项”,允许您更改对话框上的选项,而无需重新配置整个内容。因此,如果您只想使用新标题再次显示相同的对话框,您可以使用以下命令:

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

See the jQuery documentation on Dialog "option".

请参阅有关 Dialog "option"jQuery 文档

回答by jitter

Without going through all your code. I guess $('#dialog-confirm').attr("title", "Message");doesn't work the second time because jQuery UI Dialog already made changes to the actual DOM. So changing the titleattribute of the div doesn't do anything. As the actual title is probably some div/por similar generated by jQuery UI Dialog.

无需浏览所有代码。我想$('#dialog-confirm').attr("title", "Message");第二次不起作用,因为 jQuery UI Dialog 已经对实际的 DOM 进行了更改。所以改变titlediv的属性没有任何作用。由于实际标题可能是由 jQuery UI Dialog 生成的一些div/p或类似的。

Your second call to you $('#dialog-confirm').dialog({..})simply updates an existing dialog with new options.

您第二次致电您 $('#dialog-confirm').dialog({..})只是用新选项更新现有对话框。

Checking the jQuery UI Dialog documentation you should have noted that you could simply pass in an title option. So the second time instead of

检查 jQuery UI Dialog 文档,您应该注意到您可以简单地传入一个标题选项。所以第二次而不是

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

just use

只是使用

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

回答by ozberg

This worked for me (I used firebug to get the element name)..

这对我有用(我使用 firebug 来获取元素名称)。

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

回答by Khandad Niazi

You can set dialog title by id, 100% working example code below

您可以通过 id 设置对话框标题,下面是 100% 工作示例代码

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