spy*_*ter 6 asp.net-mvc jquery unobtrusive-validation asp.net-mvc-4
我正在使用带有JQuery的MVC4,我有一个使用@ Ajax.BeginForm创建的表单.它具有必填字段(在其视图模型上设置).我想在提交表单之前验证表单; 但是,它似乎没有验证.
我最初有一个提交按钮,它只是提交表单.我将提交按钮更改为常规按钮并尝试调用$('#formname').validate()但它始终返回true(即使未填写必填字段).其他视图似乎工作正常(不使用Ajax.BeginForm).
我引用了jquery,jquery-ui,jquery.validate,jquery.validate.unobtrusive和jquery.unobtrusive-ajax.
任何人有任何想法/建议我缺少什么?
编辑 - - - - - - - - - - - - - - - - - - - - - - - - - --------------------------
下面是我的代码(这是在引用jquery脚本的母版页内):
@model AimOnlineMRA.Models.Reports.DateRangeViewModel
@using (Ajax.BeginForm("GetReport", "Reports", new AjaxOptions
{
UpdateTargetId = "report_pane", HttpMethod = "Post"}, new {@id="parameterForm"}))
{
@Html.AntiForgeryToken()
<script type="text/javascript">
$(document).ready(function () {
ApplyTheme();
$('#btnYes').click(function() {
$('#RunSpecificDateRange').val('true');
$('#yesNo').hide();
$('#dateRangeForm').show();
});
$('#btnCancel').click(function () {
$('#report_pane').html('').hide();
});
$('#btnOk').click(function () {
//if ($('#parameterForm').valid()) {
// alert('valid');
//} else {
// alert('invalid');
//}
});
$('#dateRangeForm').hide();
$('#BeginDate').datepicker({
showOn: 'button',
buttonText: 'Date Picker',
buttonImageOnly: true,
buttonImage: '@Url.Content("~/Content/Icons/calendar-icon.png")'
});
$('#EndDate').datepicker({
showOn: 'button',
buttonText: 'Date Picker',
buttonImageOnly: true,
buttonImage: '@Url.Content("~/Content/Icons/calendar-icon.png")'
});
});
</script>
<div class="margin-auto" style="width: 400px">
<div id="yesNo">
<span class="bold">Do you want to run this report for a specific date range?</span>
<br /><br />
@Html.Button("Yes", "btnYes")
@Html.Button("No", "btnNo")
</div>
<div id="dateRangeForm">
<span class="bold">Date Range</span>
<br /><br />
<div class="left">
<div class="left clear-both">
@Html.LabelFor(x => x.BeginDate) <br />
@Html.TextBoxFor(x => x.BeginDate, new {@style="vertical-align:top"})
@Html.ValidationMessageFor(x => x.BeginDate)
</div>
<div class="left clear-both m-top-5">
@Html.LabelFor(x => x.EndDate) <br />
@Html.TextBoxFor(x => x.EndDate, new {@style="vertical-align:top"})
@Html.ValidationMessageFor(x => x.EndDate)
</div>
</div>
<div class="left m-left-10">
</div>
<div class="left clear-both m-top-10">
@Html.Button("Ok", "btnOk")
@Html.Button("Cancel", "btnCancel")
</div>
</div>
</div>
}
Run Code Online (Sandbox Code Playgroud)
- - - - - - - - -解析度 - - - - - - - - - - - - - - -
$.validator.unobtrusive.parse($('#parameterForm'));在$('#parameterForm').valid();修复问题之前打电话
Cri*_*ufu 26
尝试
$.validator.unobtrusive.parse($('#parameterForm'))
在打电话之前
$('#parameterForm').valid()
问题已经有了一个可接受的答案,但这是另一个可能的原因,任何人在将来发现这个...
确保表单中第一个经过验证的元素具有name属性,如下所示:
<input type=text required name='blah' />
Run Code Online (Sandbox Code Playgroud)
我花了2个小时跟踪同一个问题,我发现如果表单中的FIRST验证元素有一个name属性,那么一切都按预期工作(即,.valid()如果表单无效,则返回false).其他经过验证的元素是否具有名称属性似乎没有区别.
在普通形式中,您肯定需要名称属性,因为这是将数据提交到服务器时使用的属性.但是在更现代的环境中,例如那些使用Knockout的环境,没有理由name在输入元素上有属性,因为数据绑定可以保持数据模型的更新.