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

【问题标题】：How do I validate a model in a JQuery created dialog and Ajax如何在 JQuery 创建的对话框和 Ajax 中验证模型
【发布时间】：2011-10-18 05:41:51
【问题描述】：

我正在创建一个 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 表单中输入任何内容，它仍然会关闭

那么如何在模型验证失败时让对话框不关闭？

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

【问题讨论】：

标签： ajax model-view-controller asp.net-mvc-3 jquery

【解决方案1】：

只有在表单有效时才关闭对话框。

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

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

【讨论】：

昨天试过了，我无法让它工作，但今天它工作了：s 不确定我改变了什么。（我是 JQuery 和一般网络编程的新手）

【解决方案2】：

由于这是动态的 HTML 内容，您需要注册您想要验证的 HTML。这个blog post 应该可以帮到你。

【讨论】：