Question

我尝试在ajax请求之前验证页面/ order / create上的表单

@model rentcar2.Models.mOrderSnapshot
...
<form id="order">
   @Html.EditorFor(model => model.Fam)
<form>
....    
$('#test').click(function () {
   if ($("#order").valid()) {
      alert(1);
   } else { alert(2); }
   alert(3);
});

但在警报1之后，3我被重定向到/order/create?fam=value(model.Fam）

我只是为了验证输入并显示invalids，为什么我会重定向？

Answer 1

我建议你使用不引人注目的jQuery.validate插件。这是进行表单客户端验证的最佳方式，它包含在默认MVC.net Application中。这是一个例子：

@model rentcar2.Models.mOrderSnapshot
@Scripts.Render("~/bundles/jqueryval")

@using (Ajax.BeginForm()) {
    @Html.ValidationSummary(true)
    @Html.EditorFor(model => model.Fam)
    @Html.ValidationMessageFor(model => model.Fam)
    <input type="submit" value="Submit" />
}

（默认情况下在MVC路由中添加~/bundles/jqueryval，但您可能需要添加它并使用nuget包下载jQuery.validate

不要忘记在ViewModel上添加一些DataAnnotations，例如：

public class mOrderSnapshot {
    [Required]
    [StringLength(255)]
    public string Fam { get; set; }
}

有许多DataAnnotations个可用，你也可以自己创建它们，查看网页。

如果您想了解有关不引人注意的jQuery验证的更多信息，请查看： https://exceptionnotfound.net/asp-net-mvc-demystified-unobtrusive-validation/

编辑：您还可以使用以下方式手动触发验证过程：

$('#myForm').valid();

对于指定的元素：

$('#myForm').validate().element("#Fam");

来源：http://jqueryvalidation.org/Validator.element/#element

Answer 2

使用preventDefault停止按钮执行默认操作。

 $('#test').click(function (e) {
    e.preventDefault();
       if ($("#order").valid()) {
          alert(1);
       } else { alert(2); }
       alert(3);
    });

c＃mvc在ajax请求之前验证表单

2 个答案: