0

学习 MVC 3，我正在尝试使用 AJAX 在 MVC 中使用客户端验证：

我在文章Call MVC 3 Client Side Validation Manually for ajax posts中包含了建议，但这对我不起作用，它仍然认为表单是有效的。我错过了什么？？

我在我的申请中包含了以下内容：

根 web.config 文件：

<appSettings>
    <add key="webpages:Version" value="1.0.0.0" />
    <add key="ClientValidationEnabled" value="true" />
    <add key="UnobtrusiveJavaScriptEnabled" value="true" />
  </appSettings>

布局页面脚本：

<script src="@Url.Content("~/Scripts/jquery-1.5.1.min.js")" type="text/javascript"></script>
    <script src="@Url.Content("~/Scripts/modernizr-1.7.min.js")" type="text/javascript"></script>
    <script src="@Url.Content("~/Scripts/jquery.unobtrusive-ajax.min.js")" type="text/javascript"></script>
    <script src="@Url.Content("~/Scripts/jquery.validate.js")" type="text/javascript"></script>
    <script src="@Url.Content("~/Scripts/jquery.validate.unobtrusive.js")" type="text/javascript"></script>

我的模型：

[Table("Person")]     
public class Person
    {
        [Key]
        public int PersonID { get; set; }
        [Column("FullName")]
        [Required(ErrorMessage = "Give me a name.")]
        public string NameFull { get; set; }
        [Required(ErrorMessage = "Give me an email.")]
        public string EmailAddress { get; set; }
        [Required(ErrorMessage = "Give me a mobile number.")]
        public string MobileNo { get; set; }
        [ForeignKey("Agency")]
        [Required(ErrorMessage = "Give me an agency.")]
        public int AgencyID { get; set; }
        public virtual Agency Agency { get; set; }
    }

执行 ajax 调用的方法（触发 onclick 事件）：

function LoadPage(SFORM, SACTION, SMETHOD) {
    $('#divLoading').slideDown(1);
    var doc = document.getElementById(SFORM)
    var dataform = $(doc).serialize();
    var $form = $(doc);
    if ($form.valid()) { 
        //Ajax call here 
        $.ajax({
            type: SMETHOD,
            url: SACTION,
            data: dataform,
            complete: function () {
                $("#divLoading").slideUp(1, function () { FinishLoad() });

            },
            success: function (data) {
                $("#divMain").html(data)

            }
        });
    }
}

视图（.cshtml）：

<form id="frmCreate" name="frmCreate">
    @Html.ValidationSummary(true)
            <fieldset>
                <legend>Person</legend>

                <div class="editor-label">
                    @Html.LabelFor(model => model.NameFull)
                </div>
                <div class="editor-field">
                    @Html.EditorFor(model => model.NameFull)
                    @Html.ValidationMessageFor(model => model.NameFull)
                </div>

                <div class="editor-label">
                    @Html.LabelFor(model => model.EmailAddress)
                </div>
                <div class="editor-field">
                    @Html.EditorFor(model => model.EmailAddress)
                    @Html.ValidationMessageFor(model => model.EmailAddress)
                </div>

                <div class="editor-label">
                    @Html.LabelFor(model => model.MobileNo)
                </div>
                <div class="editor-field">
                    @Html.EditorFor(model => model.MobileNo)
                    @Html.ValidationMessageFor(model => model.MobileNo)
                </div>

                <div class="editor-label">
                    @Html.LabelFor(model => model.AgencyID, "Agency")
                </div>
                <div class="editor-field">
                    @Html.DropDownList("AgencyID", String.Empty)
                    @Html.ValidationMessageFor(model => model.AgencyID)

                </div>

                <p>
                   <input type="button" value="Create" onclick="LoadMenuItem('frmCreate','@Url.Action("Create", "Person")', 'POST')" />
                </p>
            </fieldset>
</form>
4

1 回答 1

0

似乎已经弄清楚了，看来您必须使用@using (Html.BeginForm(null, null, FormMethod.Get, new { name = "validator", id = "validator" }))创建表单而不是标准标签，然后使用要验证的视图底部的脚本分配要验证的表单$.validator.unobtrusive.parse("#validator");

这样做的好处是，在您的布局页面上，您可能有一个具有不同 ID 的“父表单”，其中可能包含您可能希望使用经过验证的表单发布的隐藏字段，您所要做的就是发布父表单，但是验证仍将发生在您在$.validator.unobtrusive.parse("#validator");部分视图的脚本中分配的表单上。

于 2012-07-31T14:24:06.180 回答