Jquery asp 中带点的验证字段-for

Question

此处验证无效，请指导我。我试着按照这个但没有成功 How to validate input fields with a dot in name using the jquery validation plugin? 谢谢

JSFiddle link: 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');
        });
      });

Answer 1

而不是asp-for尝试name输入属性

所有需要验证的输入元素都需要一个 'name' 属性，没有这个插件将无法工作。

如果你想 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');
            });
          });

<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>

Jquery asp 中带点的验证字段-for

Jquery Validation fields with dot in asp-for

javascript

jquery

jquery-validate