Question

由于JQM 1.4改变了一些小部件，为了使用＆＃34; dialog＆＃34;小部件，有2个选项：

数据角色=＆＃34;页面＆＃34;数据对话=＆＃34;真＆＃34;
数据的rel =＆＃34;弹出＆＃34;

我使用第一种方法，所以当用户点击＆＃34; OK＆＃34;我的对话框的按钮，我更新数据库，如果一切正常，我想关闭对话框。

正如JQM doc中提到的，我尝试使用$( ".selector" ).dialog( "close" )，但它会抛出Uncaught Error: cannot call methods on dialog prior to initialization; attempted to call method 'close'。一些示例代码：

对话框HTML

<div id="manage-page" data-role="page" data-dialog="true" data-corners="false" data-close-btn="right" data-overlay-theme="b"> 
    <div data-role="header">
        <h1>Manage</h1> 
    </div>
    <div data-role="content">  
        <h3>Title</h3>
        <input type="text" id="title" value=""/>
        <a href="#" id="saveTitle" data-role="button">Save</a>  
    </div>
</div>

Dialog JS

$(document).on('click', '#saveTitle', function(){
    var title= $('#title').val();

    $.ajax({
        type: "POST",
        url: CUSTOM_URL,
        success: function(data) {
            if(data != -1)
                $('#manage-page').dialog('close'); 
            else
                // Some stuff
        },
        error: function() {
            console.log("ERROR saving title");
        }
    });
});

有什么问题？感谢

更新

我在打开的按钮中使用data-rel="back"并删除$('#manage-page').dialog('close');

Answer 1

我重现了这个错误。您的对话框代码没问题，但您必须修复用于打开对话框的方式。您必须添加选项：

$.mobile.changePage(domain() + '/private/manageDialog', {role:"dialog"});

或添加data-rel属性：

<a href="#manage-page" data-rel="dialog">Open dialog</a>

JQuery Mobile 1.4以编程方式关闭对话框

1 个答案: