Question

我已经搜遍了这个答案。我发现了类似的问题并尝试了他们的建议，但都无济于事，所以我试图在这里发布我的问题。请原谅任何重复。另外，我是一个经验丰富的Javascripter，但是jQuery noob。

我的问题：我有一个带有按钮btnStates的模态jQuery UI对话框（不在父对话框的按钮数组中，但在div中）。单击按钮后，我希望它在html中弹出第二个模式对话框，其显示设置为无。 div只包含一个简单的州选项选择元素。用户必须选择状态并按“确定”，或“取消”返回父对话框。

我无法让它发挥作用。在代码的一种配置中，它会在document.ready上弹出我的状态对话框，但忽略我将其编码为click事件。有人能告诉我我的jQuery在哪里实现这个目的是错误的吗？这是我对jQuery代码的最新尝试：

$(function() {
    $("#tabs").tabs();
    $( "#dlgInstitutionSearch" ).dialog(
        { 
            dialogClass: "no-close", minWidth:512, minHeight:410, closeOnEscape:true, 
            buttons: [ 
                { text: "Search", click: function() { $( this ).dialog( "close" ); } }, 
                { text: "Cancel", click: function() { $( this ).dialog( "close" ); } }, 
                { text: "Help", click: function() { $( this ).dialog( "close" ); } } 
            ] 
    });

    $("#btnStates").click(function(){
        $("#dlgStatesList").dialog({
            dialogClass: "no-close", minWidth:200, minHeight:300, closeOnEscape:true, 
            buttons: [ 
                { text: "OK", click: function() { $( this ).dialog( "close" ); } }, 
                { text: "Cancel", click: function() { $( this ).dialog( "close" ); } }
            ] 
        });
    });

});

Answer 1

我想你想在一步中初始化“内部”对话框，然后在另一步中打开它：

$(function() {
    $("#tabs").tabs();
    $( "#dlgInstitutionSearch" ).dialog(
        { 
            dialogClass: "no-close", minWidth:512, minHeight:410, closeOnEscape:true, 
            buttons: [ 
                { text: "Search", click: function() { $( this ).dialog( "close" ); } }, 
                { text: "Cancel", click: function() { $( this ).dialog( "close" ); } }, 
                { text: "Help", click: function() { $( this ).dialog( "close" ); } } 
            ] 
    });

    // Initialize the dialog
    $("#dlgStatesList").dialog({
        autoOpen: false,
        dialogClass: "no-close", minWidth:200, minHeight:300, closeOnEscape:true, 
        buttons: [ 
            { text: "OK", click: function() { $( this ).dialog( "close" ); } }, 
            { text: "Cancel", click: function() { $( this ).dialog( "close" ); } }
        ] 
    });

    // Open state dialog on click
    $("#btnStates").click(function(){
        $("#dlgStatesList").dialog("open");
    });

});

编辑：添加了演示：http://jsfiddle.net/mmeNS/

从父对话框按钮单击JQuery UI对话框触发器

1 个答案: