如何在部分视图表单上完成客户端验证

Question

我有一个新的 MVC5，我开始使用它进行编码/学习，在我看来，我称之为局部视图，在那个局部视图中我有一个表单。

如何验证我的局部视图客户端，以便在模型无效时不会发布帖子？

我正在尝试在我的模型中使用数据注释。我在其他地方使用它们取得了成功，但不是在表单发布或部分视图的情况下。

部分视图：

@model MyProject.Models.MyModel
    @using (Html.BeginForm("SubmmitPerson", "Home", FormMethod.Post, new { @class = "form-horizontal" }))
            {                                        
                    <div class="form-group">
                        <label for="NAME" class="col-sm-2 control-label">Name:</label>
                        <div class="col-sm-10">
                            @Html.Kendo().TextBoxFor(x => x.NAME).HtmlAttributes(new { @class = "form-control kendoTextBox" })
                        </div>
                    </div>
                    <div class="form-group">
                        <label for="PHONE" class="col-sm-2 control-label">Phone:</label>
                        <div class="col-sm-10">
                            @Html.Kendo().TextBoxFor(x => x.PHONE).HtmlAttributes(new { @class = "form-control kendoTextBox" })
                        </div>
                    </div>
                    <div class="form-group">
                        <label for="ADDITIONALINFO" class="col-sm-2 control-label">Additional Information:</label>
                        <div class="col-sm-10">
                            @Html.Kendo().TextBoxFor(x => x.ADDITIONALINFO).HtmlAttributes(new { @class = "form-control kendoTextBox" })
                        </div>
                    </div>
                    <div class="form-group">
                        <div class="col-sm-offset-2 col-sm-10">
                            @(Html.Kendo().Button().Name("btnClose").Content("Cancel").Events(x => x.Click("btnClose_onClick")))
                            @(Html.Kendo().Button().Name("btnSave").Content("Save").Events(x => x.Click("btnSave_onClick")))
                        </div>
                    </div>
            }

我的视图模型是：

public partial class MyModel
    {
        [Required(ErrorMessage = "Name is required")]
        [Display(Name="Filter Name")]
        public string NAME { get; set; }
        [Required]
        public string PHONE { get; set; }
        public string ADDITIONALINFO { get; set; }
    }

Answer 1

下载并添加名为 3 JavaScript 的参考

(1)jquery-1.7.1.min.js (2) jquery.validate.unobtrusive.min.js (3) jquery.validate.min.js