错误：无法在初始化之前调用对话框上的方法；试图调用方法“打开”

Question

只是一个小前言...我对 jQuery 还很陌生，所以如果有什么看起来不对或多余的地方，请随时提供任何有用的建议。

现在讨论这个问题。我有 2 个从页面上的 2 个单独链接启动的模式。

• 第一个模式完全没有问题。这是一个简单的表单，可以回发到同一页面。如果您想知道“关闭：”部分中的项目是什么，它们是我想在对话框关闭时清除其值的表单字段。
• 添加第二个后，我遇到了问题。该模态将coldfusion页面调用为模态显示图片。打开第二个后出现问题。我无法从“关闭”按钮关闭第二个模式。我收到以下错误。

错误：无法在初始化之前调用对话框上的方法；试图调用方法'close'

我必须从模式右上角的“x”关闭它。关闭后，尝试打开第一个时出现错误。

错误：无法在初始化之前调用对话框上的方法；试图调用方法'open'

这是它的代码。

$(document).ready(function() {
    $(".dig").click(function() {
        //based on which we click, get the current values
        var cItemName = $("#checklistItemName").attr( "title");
        var c2id = $("#check2id").attr( "title");
        $("#ItemName").html(cItemName);
        $("#ItemID").html(c2id);
        $("#objCheckItemName").val(cItemName);        
        $("#objCheck2ID").val(c2id);
        console.log(cItemName);
        console.log(c2id);
    }); 
    $( "#image-form" ).dialog({
        autoOpen: false,
        height: 450,
        width: 650,
        modal: true,
        buttons: {
            "Submit": function() {
                $('#mForm').submit();
                return true;
            },
            Cancel: function() {
                $( this ).dialog( "close" );
            }
        },
        close: function() {
            $('#defaultSectionName')
                .val('');
            $('#defaultSectionDesc_hidden')
                .val('');
            $('#Photo')
                .val('');
            $('#objCheck2ID')
                .val('');
            $('#Check21')
                .val('');
        },
        zIndex: 500
    });

下一段代码是我认为出现问题的地方。

    $( "#image_trigger" )
        .click(function() {
        $( "#image-form" ).dialog( "open" );
    });
    var dlg=$('#register').dialog({
        title: 'Case Pictures',
        resizable: true,
        autoOpen:false,
        modal: true,
        hide: 'fade',
        width:650,
        height:450,
        buttons: {
            close: function() {
                $( this ).dialog( "close" );
            }
        },
        zIndex: 500
    });
    $('#reg_link').click(function(e) {
        e.preventDefault();
        var linkurl=('assets/includes/modalPictures.cfm' + '?'
            + 'id=' + $("#objCheck2ID").val()
    );
    dlg.load(linkurl, function(){
        dlg.dialog('open');
    });
});

jQuery UI：1.10.1

jQuery：1.9.1

服务器端：Coldfusion

HTML 相当广泛。如果您需要查看其中的任何部分，请告诉我。感谢您的帮助！

Answer 1

您必须在调用 open 函数之前初始化您的 jquery 对话框。

<script type="text/javascript">
    $(document).ready(function () {
         initializeDialog();
    });
</script>

并更改您的 js 文件以在 initializeDialog() 函数中包含对话框代码。

function initializeDialog(){
    
    $("#your-dialog-id").dialog({
        autoOpen: false,
        buttons: {
            "Cancel": function() {
                $(this).dialog("close");
            }
        },
        modal: true,
        resizable: false,
        width: 600px,
        height: 400px
    });
}

感谢@bpjoshi

Answer 2

大写？

Close: function() {