Question

ajax很新。

所以我有这个div：

   <div id="authentication" title="Authentication" >
    <b>Please Generate a new token to continue!</b>
    <br /><br />
    <table>
        <tr>
            <td>Token:</td>
            <td><input type="text" id="txtToken"/></td>
        </tr>
        <tr>
            <td></td>
            <td><label id="lblError"></label></td>
        </tr>
    </table>
 </div>

没有显示在我的mvc视图上，因为它被以下Ajax代码用作对话框：

$('#authentication').dialog({
    autoOpen: true,
    width:500,
    resizable: false,
    beforeclose : function() { return false; },
    title: 'Authentication',
    modal: true,
    buttons: {
        "Cancel": function () {
            window.location.replace("@Url.Action("Index", "Home")");
        },
        "Submit": function () {
            var token=$('#txtToken').val();
            var dlg = $(this);
            $.ajax({
                type: 'POST',
                data: { 'token': token},
                dataType: 'json',
                url: '@Url.Action("CheckNewToken", "Account")',
                success: function (result) {
                    if(result==true)
                    {
                        window.parent.jQuery('#authentication').dialog('destroy');
                    }
                    else{
                        $('#lblError').html("Incorrect credentials. Please try again");
                    }
                },
                error: function (xhr, ajaxOptions, thrownError) { 
        }
            });
        }
    }
});

然而，当代码转到成功并且结果==结果时，对话框被销毁但是div（对话框）然后显示在我不想要的视图上。我做错了什么？

Answer 1

关闭对话框，然后销毁。这将完全隐藏对话框，然后销毁其对话框功能。如果您只是.dialog('destroy')，它将完全删除对话框功能并在页面上显示该元素，但它不会隐藏。

success: function (result) {
                    if(result==true)
                    {
                        $('#authentication').dialog('close').dialog('destroy');
                    }
                    else{
                        $('#lblError').html("Incorrect credentials. Please try again");
                    }
                },

另一件事是beforeclose : function() { return false; },你返回false会阻止关闭事件的发生。虽然你可以安全地删除它，但它应该是beforeClose。

如果以上不起作用，则删除div的另一个选项是订阅close事件： -

   $('#authentication').dialog({
    autoOpen: true,
    width:500,
    resizable: false,
    title: 'Authentication',
    modal: true,
    close:function(){

        $(this).dialog('destroy').hide();
     },
    buttons: {
        "Cancel": function () {

        },
        "Submit": function () {
            var token=$('#txtToken').val();
            var dlg = $(this);
           $('#authentication').dialog('close');
        }
    }
});

Ajax在mvc视图中显示div对话框

1 个答案: