Question

我正在创建一个JQuery对话框，其中我使用了我要验证的模型中的数据，但是该框刚刚关闭，如果我再次单击打开对话框我可以看到红色文本指示错误，但它只是闭合。

function createEditorDialog() {
    $('#floatsam_editor').dialog({ bgiframe: true, autoOpen: false, modal: true, width: 512,
        buttons: {
            'Close': function () { $('#floatsam_editor').dialog('close'); },
            'Create': function () {
                $('#flotsam_form').submit();
                $('#floatsam_editor').dialog('close');
            }
        }
    });
};

因此红色文本出现在提交中，但即使验证失败，它也会立即关闭。

以下是显示的ajax beginform的一部分

<div id="floatsam_editor">
@using (Ajax.BeginForm("CreateFlotsam" , "Flotsam", new { }, new AjaxOptions { HttpMethod = "Post", OnSuccess = "systematic_flotsam.successRequest" }, new { Id = "flotsam_form" }))
{
    <div>
        <fieldset>
            <legend>Create Log Entries</legend>
            <div >
                <span class="editor-label">
                        @Html.LabelFor(m => m.Received.Date)
                    </span>
                    <span class="editor-field">
                        @Html.TextBoxFor(m => m.Received.Date, new { id = "flotsam_date", @class="datepicker", maxlength="10"})
                    </span>
                    <span class="editor-field">
                        @Html.TextBoxFor(m => m.Received.Hour, new { id = "flotsam_hours", maxlength="2" })
                    </span>:<span class="editor-field">
                        @Html.TextBoxFor(m => m.Received.Minute, new { id = "flotsam_minutes", maxlength="2"})
                    </span>
                    <span>
                        @Html.ValidationMessageFor(m => m.Received.Date)
                        @Html.ValidationMessageFor(m => m.Received.Hour)
                        @Html.ValidationMessageFor(m => m.Received.Minute)
                    </span>
                </div>

            <div>
                <div class="editor-label">
                    @Html.LabelFor(m =>m.Flotsam.Informant)
                </div>
                <div class="editor-field">
                    @Html.TextBoxFor(m => m.Flotsam.Informant, new { @class = "flotsam_dialog_editor_field" })
                    @Html.ValidationMessageFor(m =>m.Flotsam.Informant)
                </div>
            </div>

我的模型的一部分在这里

        [DisplayName("Informant:")]
    [Required]
    public object Informant { get; set; }

    [DisplayName("Flotsam Nature:")]
    [Required]
    public object FlotsamNature { get; set; }

    [DisplayName("Position of Loss:")]
    [Required]
    public object Position { get; set; }

并且看到它有3个属性是必需的，但如果我不在我的ajax形式输入任何东西它仍然关闭

那么当模型验证失败时，如何使对话框不关闭？

一个非常重要的注意事项是，所有这些都在一个站点和客户端完成，我不想重新加载页面。

Answer 1

如果表单有效，则仅关闭对话框。

if($("#flotsam_form").valid())
{
   $('#flotsam_form').submit();
   $('#floatsam_editor').dialog('close');
}

这样它的对话框将保持打开状态并出现验证错误

Answer 2

由于这是动态的HTML内容，因此您需要注册要验证的HTML。这个blog post可以帮助你。

如何在JQuery创建的对话框和Ajax中验证模型

2 个答案: