验证在这里不起作用,请指导我。我试图遵循这个但没有工作How to validate input fields with a dot in name using the jquery validation plugin?谢谢
JSFiddle链接:https://jsfiddle.net/arshad7abdul/8mu8wL84/4/
<form id="appForm" asp-controller="some" asp-action="AnonymousApp" method="post">
<div class="panel-body pt0 p10">
<section class="grid grid--direction-row">
<!-- First Name -->
<div class="grid__col-4">
<label class="control-label">First Name <i class="fa fa-asterisk"></i></label>
<input asp-for="TaxPreparer.FirstName" class="form-control" maxlength="50"/>
</div>
<!-- Middle Name -->
<div class="grid__col-4">
<label class="control-label">Middle Name</label>
<input asp-for="TaxPreparer.MiddleName" class="form-control charlimit" maxlength="50"/>
</div>
<!-- Last Name -->
<div class="grid__col-4">
<label class="control-label">Last Name <i class="fa fa-asterisk"></i></label>
<input asp-for="TaxPreparer.LastName" class="form-control charlimit" maxlength="50"/>
</div>
</section>
</div>
<input class="btn btn-success btn-large" style="float: right; "id="submitApp" type="submit" value="Submit" />
</form>
这是Javascript
$(document).ready(function() {
var checkformValidation = function () {
$("#appForm").validate({
rules: {
"TaxPreparer.FirstName": "required"
}
});
}
$('#submitApp').click(function(e) {
e.preventDefault();
checkformValidation();
//checkValidation();
//$("#appForm").validate();
if ($("#appForm").valid()) {
alert("success");
return;
} else {
alert("wrong");
}
//$('#submitAppModal').modal('show');
});
});
答案 0 :(得分:0)
而不是输入<{p>上的asp-for
尝试name
属性
需要验证的所有输入元素都需要&#39; name&#39; 属性,如果没有此功能,插件将无效。
如果您希望将asp-for
用于其他目的,您可以保留它但是您必须使用提到的插件输入验证名称
https://jsfiddle.net/206ku1yL/1/
$(document).ready(function() {
var checkformValidation = function () {
$("#appForm").validate({
rules: {
"TaxPreparer.FirstName": "required"
}
});
}
$('#submitApp').click(function(e) {
e.preventDefault();
checkformValidation();
//checkValidation();
//$("#appForm").validate();
if ($("#appForm").valid()) {
alert("success");
return;
} else {
alert("wrong");
}
//$('#submitAppModal').modal('show');
});
});
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.17.0/jquery.validate.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-validation-unobtrusive/3.2.6/jquery.validate.unobtrusive.min.js"></script>
<form id="appForm" asp-controller="some" asp-action="AnonymousApp" method="post">
<div class="panel-body pt0 p10">
<section class="grid grid--direction-row">
<!-- First Name -->
<div class="grid__col-4">
<label class="control-label">First Name <i class="fa fa-asterisk"></i></label>
<input name="TaxPreparer.FirstName" class="form-control" maxlength="50"/>
</div>
<!-- Middle Name -->
<div class="grid__col-4">
<label class="control-label">Middle Name</label>
<input name="TaxPreparer.MiddleName" class="form-control charlimit" maxlength="50"/>
</div>
<!-- Last Name -->
<div class="grid__col-4">
<label class="control-label">Last Name <i class="fa fa-asterisk"></i></label>
<input name="TaxPreparer.LastName" class="form-control charlimit" maxlength="50"/>
</div>
</section>
</div>
<input class="btn btn-success btn-large" style="float: right; "id="submitApp" type="submit" value="Submit" />
</form>
&#13;