在我的 MVC 4 项目中通过 ajax 请求提交表单时,我一直很难让不引人注目的验证发挥作用。作为引用,本主题中的人正在做与我几乎相同的事情:
Manual form validation in MVC 3 and JQuery
我经历了那里所做的事情,但我仍然无法让它工作。问题是,当我执行 $("#Form").valid() 时,它总是返回 true,即使我发送请求,模型无效。我在我的包中设置了适当的脚本,但我无法获取表单来正确验证客户端。我怎样才能正确验证这一点?我认为一旦设置了数据注释,它就“应该可以工作”,但显然这里的情况并非如此。
此外,这个特定的表单也在 Kendo UI 窗口中从部分 View 中使用 jQuery 加载。看完这篇文章的答案后:Asp MVC unobtrusive Client Validation always returning true使用表单 id 作为选择器并且 .valid() 仍然返回 true,但类名称为 false。但是,guid 学期 ID 返回 true。
我的代码如下:
型号
public class Class
{
public Class()
{
ClassId = Guid.NewGuid();
}
[Key]
public Guid ClassId { get; set; }
[Display(Name = "Class Name")]
[Required(ErrorMessage = "A Class Name is required.")]
public string ClassName { get; set; }
public int UserId { get; set; }
[Display(Name = "Term Type")]
[Required(ErrorMessage = "The Term Type is required.")]
public Guid SemesterId { get; set; }
[ForeignKey("SemesterId")]
public virtual Semester Semester { get; set; }
[Display(Name = "Class Year")]
public int Year { get; set; }
[Display(Name = "Has Weighted Grades?")]
public bool HasWeightedGrades { get; set; }
public virtual List<Grade> Grades { get; set; }
}
表格
@using (Html.BeginForm("AddClass", "", FormMethod.Post, new { name = "AddNewClassForm", id = "AddNewClassForm" }))
{
<div>
<div>@Html.LabelFor(m => m.ClassName)</div>
<div>
@Html.TextBoxFor(m => m.ClassName, new { @class = "input-xlarge" })
@Html.ValidationMessageFor(m => m.ClassName)
</div>
<div>@Html.LabelFor(m => m.SemesterId)</div>
<div>
@Html.DropDownList("SemesterId", null, "-- Select a Term Type --", new { @class = "input-xlarge" })
@Html.ValidationMessageFor(m => m.SemesterId)
</div>
</div>
}
<div>
<button id="AddClassButton" class="btn btn-primary" type="submit"><i class="icon-plus icon-white"></i> Add Class</button>
<button id="CancelAddClassButton" class="btn btn-danger" type="submit"><i class="icon-ban-circle icon-white"></i> Cancel</button>
</div>
jQuery 事件
//================================================================================================================================
// AddClassButton: Click event handlers.
//================================================================================================================================
$('#AddClassButton').unbind('click').bind('click', function (e) {
$.validator.unobtrusive.parse($('#AddClassWindow'));
var val = $("#AddNewClassForm").validate();
val.showErrors();
alert("Is the form valid? " + val.valid()); //Always returns true
alert("Is Class Name Valid? " + $("#ClassName").valid()); //Still returns true
alert("Is Semester Id Valid? " + $("#SemesterId").valid()); //Still returns true
e.preventDefault(); // Prevent this from doing default (possibly submit form).
e.stopPropagation(); // Prevent infinite loop.
});
捆绑
bundles.Add(new ScriptBundle("~/bundles/jqueryval").Include(
"~/Scripts/jquery.unobtrusive*",
"~/Scripts/jquery.validate*"));
//Ignoring these so only the min.js versions get rendered
bundles.IgnoreList.Ignore("jquery.validate.js");
bundles.IgnoreList.Ignore("jquery.validate.unobtrusive.js");
bundles.IgnoreList.Ignore("jquery.unobtrusive-ajax.js");
Controller 操作
[Authorize]
public ActionResult AddClass()
{
var userName = User.Identity.Name;
var userProfile = db.UserProfiles.SingleOrDefault(x => x.UserName == userName);
InitializeSemesters();
InitializeYears();
return PartialView(new Class() { UserId = userProfile.UserId, Year = DateTime.Now.Year });
}
最佳答案
您必须将以下脚本添加到您的 _Layout 或 View “jquery.unobtrusive-ajax.js” “jquery.validate.js” “jquery.validate.unobtrusive.js”
关于jquery - 使用 jQuery 的 MVC 手动表单验证始终返回 True,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/17764234/