在 ajax 方法调用之前验证模型数据答案

【问题标题】：Validate Model data before ajax method call在 ajax 方法调用之前验证模型数据
【发布时间】：2013-03-27 11:23:30
【问题描述】：

我对我的应用程序有一个部分视图我正在部分视图上创建用户注册功能（不使用任何表单标签），我正在使用 ajax-jquery 调用控制器的操作方法并将用户详细信息（模型）传递给操作方法，之前调用 ajax 方法我需要在客户端验证用户详细信息。我该怎么做？

需要在ajax调用之前验证模型（不使用任何表单标签）。

@model MVC4Demo.Models.Student

<script src="~/Scripts/jquery-1.7.1.min.js"></script>
<script src="~/Scripts/jquery.validate.min.js"></script>
<script src="~/Scripts/jquery.validate.unobtrusive.min.js"></script>
<script type="text/javascript">
function onClientClick() {        

    var obj = { FirstName: "name",  City: "abc" };
    $.ajax({
        url: "/Home/AjaxDemo",
        data: JSON.stringify(obj),
        type: "POST",
        datatype: "json",
        contentType: "application/json; charset=utf-8",
        success: function (result) {
            alert('success');                
        },
        error: function () {
            alert("error");
        }
    });
}
</script>


<div id="Main">
<label>Student</label>

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

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

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

<p>
    <input type="submit" onclick="onClientClick()" value="Create" />
</p>
</div>


<div>
@Html.ActionLink("Back to List", "Index")
 </div>

【问题讨论】：

为什么你不想在你的数据周围加上
标签？它甚至可以是一个空的

标签。 jquery.validate.unobtrusive 要求在您的验证字段周围有一个表单。
@migontech 我正在部分视图上实现注册功能，并且我在父视图上已经有表单标签，在注册时我需要验证仅部分视图而不是整个表单的值

标签： c# jquery ajax asp.net-mvc

【解决方案1】：

把你的模型变成形式。之后：

<script>
$(function () {
    $('#myForm').unbind('submit');
    $('#myForm')
        .bind('submit', function () {
            var form = this;
            if ($("#myForm").valid()) {
                $.post('/Home/AjaxDemo', $(form).serialize(), function (data) {

                    if (data.success) {
                        alert('success');
                    } else {
                        alert("error");
                    }
                });
            }

            return false;
        });
});

【讨论】：

正如我所描述的，我没有使用任何表单标签。

【解决方案2】：

恐怕需要一个表单标签。还有其他的，你可以在前面加上

@Html.EnableClientValidation();
@Html.ValidationSummary(true);

到表格。

【讨论】：