C# 使用jquery ajax添加的部分视图中的验证问题

C# 使用jquery ajax添加的部分视图中的验证问题,c#,jquery,asp.net-mvc-4,C#,Jquery,Asp.net Mvc 4,我读了很多帖子,但无法解决我的问题 我有一个视图,它在点击时有一个添加按钮。我显示的是部分视图,该部分视图有一个用于添加记录的表单,该表单不验证客户端。我正在使用jquery验证,并且在打开部分视图的主视图中添加了js文件 <script src="@Url.Content("~/Scripts/jquery.validate.min.js")" type="text/javascript"></script> <script src="@Url.Content(

我读了很多帖子,但无法解决我的问题

我有一个视图,它在点击时有一个添加按钮。我显示的是部分视图,该部分视图有一个用于添加记录的表单,该表单不验证客户端。我正在使用jquery验证,并且在打开部分视图的主视图中添加了js文件

<script src="@Url.Content("~/Scripts/jquery.validate.min.js")" type="text/javascript"></script>

<script src="@Url.Content("~/Scripts/jquery.validate.unobtrusive.js")" type="text/javascript"></script>
水平视图:

 <div id="Div1">
   <a id="lnkAdd">
      <div>Add</div>
   </a>
 </div>

$("#lnkAdd").click(function () {
       $.ajax({
            url:  '@Url.Action("MethodName", "ControllerName")',
       type: "POST",
            error: function (xhr, ajaxOptions, thrownError) {
                alert(xhr.status);
                alert(thrownError);
            }
    }).done(function () {
    }).success(function (dv) {
        $("#Div1").html(dv);
    })
    });
[Authorize]
    public PartialViewResult MethodName()
    {
        return PartialView("_PartialViewName");
    }
<div id="UsersDiv">

<div class="grid-background" style="border: 1px solid #8dc2f5;">

    @using (Html.BeginForm("AddRecord", "ControllerName"))
    {
      <div class="form-bg" style="border: 0px; margin-top: 0px; width: 966px;">
     <div class="form-field-bg">
      @Html.LabelFor(m => m.FirstName)
      @Html.TextBoxFor(m => m.FirstName, new { @class = "label-class" })
      @Html.ValidationMessageFor(m => m.FirstName, "", new { @class = "validation-class" })
    </div>

  <input type="submit" value="Save" id="btnSaveUsers" name="AddRecord" class="signup-button" />
     }

@使用(Html.BeginForm(“AddRecord”、“ControllerName”))
{
@LabelFor(m=>m.FirstName)
@TextBoxFor(m=>m.FirstName,新的{@class=“label class”})
@Html.ValidationMessageFor(m=>m.FirstName,“,new{@class=“validation class”})
}

只有在触发document.ready事件时才会连接验证程序,对于动态内容,您必须手动触发它们

将成功处理程序更改为:

.success(function (dv) {
    $("#Div1").html(dv);

    $("form").data("validator", null);
    $.validator.unobtrusive.parse($("form"));
})

您可以在服务器端验证模型,并在客户端附加错误

 public PartialViewResult _CreateSupplier()
        {
            return PartialView(new Supplier());
        }

    [HttpPost]
    public JsonResult _CreateSupplier(Supplier model)
    {
    //Validation
    return Json(new
                    {
                        status = transactionStatus,
                        modelState = ModelState.GetModelErorrs()
                    }, JsonRequestBehavior.AllowGet);
    }
FormPostjQuery方法

$('#create-supplier').submit(function (e) {
    e.preventDefault();
    var $form = $(this);
    if (!ModelIsValid($form))
        return;
    AjaxPost($form.serialize(), '@Url.Action("_CreateSupplier")', function (result) {
        if (result.status == 0) {
            $form[0].reset();
            //Success
            var grid = $("#gridSupplier").data("kendoGrid");
            grid.dataSource.read();
        } else if (result.status == 1)
            AddFormErrors($form, result);
        else if (result.status == 2)
           //error;
    });
});
检查模型方法是否有效,如果无效,则向表单中添加错误

function ModelIsValid(form) {
    var validator = $(form).validate(); // obtain validator
    var anyError = false;
    form.find("input").each(function () {
        if (!validator.element(this)) { // validate every input element inside this step
            anyError = true;
        }
    });

    if (anyError)
        return false; // exit if any error found    
    return true;
}

function AddFormErrors(form, errors) {
    for (var i = 0; i < errors.modelState.length; i++) {
        for (var j = 0; j < errors.modelState[i].errors.length; j++) {
            var val = $(form).find("[data-valmsg-for='" + errors.modelState[i].key + "']");
            if (val.html().length > 0) {
                $(form).find("[for='" + errors.modelState[i].key + "']").html(errors.modelState[i].errors[j]);
            } else {
                val.html('<span for="' + errors.modelState[i].key + '" generated="true" class="" style="">' + errors.modelState[i].errors[j] + '</span>');
            }
        }
    }
}
最后一个检查返回模型状态错误的c#扩展方法

 public static IEnumerable<object> GetModelErorrs(this ModelStateDictionary modelState)
        {
            return modelState.Keys.Where(x => modelState[x].Errors.Count > 0)
                .Select(x => new {
                 key = x,
                 errors = modelState[x].Errors.Select(y => y.ErrorMessage).ToArray()
                });
        }
公共静态IEnumerable GetModelErrors(此ModelStateDictionary modelState)
{
返回modelState.Keys.Where(x=>modelState[x].Errors.Count>0)
.选择(x=>new{
键=x,
errors=modelState[x].errors.Select(y=>y.ErrorMessage).ToArray()
});
}

是否包含jQuery文件

<script src="@Url.Content("~/Scripts/jquery-2.0.0.min.js")" type="text/javascript"></script>

我修复了在渲染部分内容后添加以下代码的问题

@Scripts.Render("~/bundles/jqueryval")

我不知道你是否能写既成功又成功!!!它给我错误UncaughtTypeError:无法读取chrome中未定义的属性“unobtrusive”。
@Scripts.Render("~/bundles/jqueryval")