我有这样简单的ASP.NET MVC操作:
public ActionResult Edit(EditPostViewModel data) { }
该EditPostViewModel有这样的验证特性:
EditPostViewModel
[Display(Name = "...", Description = "...")] [StringLength(100, MinimumLength = 3, ErrorMessage = "...")] [Required()] public string Title { get; set; }
在视图中,我正在使用以下助手:
@Html.LabelFor(Model => Model.EditPostViewModel.Title, true) @Html.TextBoxFor(Model => Model.EditPostViewModel.Title, new { @class = "tb1", @Style = "width:400px;" })
如果我在将文本框置于验证中的表单上进行提交,则将首先在客户端上执行,然后在service(ModelState.IsValid)上完成。
ModelState.IsValid
现在我有几个问题:
可以将其与jQuery ajax提交一起使用吗?我正在做的就是简单地删除表单,然后单击“提交”按钮,javascript将收集数据,然后运行$.ajax。
$.ajax
服务器端可以ModelState.IsValid工作吗?
如何将验证问题转发回客户端,并像使用生成intvalidation(@Html.ValidationSummary(true))的方式呈现出来?
@Html.ValidationSummary(true)
Ajax调用示例:
function SendPost(actionPath) { $.ajax({ url: actionPath, type: 'POST', dataType: 'json', data: { Text: $('#EditPostViewModel_Text').val(), Title: $('#EditPostViewModel_Title').val() }, success: function (data) { alert('success'); }, error: function () { alert('error'); } }); }
编辑1:
包含在页面上:
<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>
使用该jQuery.validate库应该非常简单。
jQuery.validate
在Web.config文件中指定以下设置:
Web.config
<appSettings> <add key="ClientValidationEnabled" value="true"/> <add key="UnobtrusiveJavaScriptEnabled" value="true"/> </appSettings>
建立视图时,您将定义如下内容:
@Html.LabelFor(Model => Model.EditPostViewModel.Title, true) @Html.TextBoxFor(Model => Model.EditPostViewModel.Title, new { @class = "tb1", @Style = "width:400px;" }) @Html.ValidationMessageFor(Model => Model.EditPostViewModel.Title)
注意: 这些需要在表单元素中定义
然后,您需要包括以下库:
<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>
这应该能够使您进行客户端验证
注意: 这仅用于jQuery.validation库顶部的其他服务器端验证
jQuery.validation
也许这样的事情可能会有所帮助:
[ValidateAjax] public JsonResult Edit(EditPostViewModel data) { //Save data return Json(new { Success = true } ); }
当ValidateAjax一个属性定义为:
ValidateAjax
public class ValidateAjaxAttribute : ActionFilterAttribute { public override void OnActionExecuting(ActionExecutingContext filterContext) { if (!filterContext.HttpContext.Request.IsAjaxRequest()) return; var modelState = filterContext.Controller.ViewData.ModelState; if (!modelState.IsValid) { var errorModel = from x in modelState.Keys where modelState[x].Errors.Count > 0 select new { key = x, errors = modelState[x].Errors. Select(y => y.ErrorMessage). ToArray() }; filterContext.Result = new JsonResult() { Data = errorModel }; filterContext.HttpContext.Response.StatusCode = (int) HttpStatusCode.BadRequest; } } }
这样做是返回一个JSON对象,该对象指定所有模型错误。
示例响应将是
[{ "key":"Name", "errors":["The Name field is required."] }, { "key":"Description", "errors":["The Description field is required."] }]
这将返回到您的错误处理回调$.ajax调用
您可以遍历返回的数据以根据返回的键根据需要设置错误消息(我认为类似的东西$('input[name="' + err.key + '"]')会找到您的输入元素
$('input[name="' + err.key + '"]')