Cannot validate dynamic fields using jquery validator

纵然是瞬间 提交于 2020-07-03 13:25:33

问题


I am creating some dynamic field with two fixed fields, My html structure is as follows:

<form method="POST" action="http://localhost:8000/admin/add" accept-charset="UTF-8" class="form-horizontal addclass" id="frmaddclass" enctype="multipart/form-data" novalidate="novalidate">

<input class="form-control error" placeholder="Name" id="name" required="" name="name" type="text" value="" aria-invalid="true">

<select class="form-control" required="" name="status"><option value="" selected="selected">Select</option><option value="active">active</option><option value="disabled">inactive</option></select>
<select class="form-control" required="" name="subject[]"><option value="" selected="selected">Select</option><option value="science">science</option><option value="english">english</option></select>
<select class="form-control" required="" name="subject[]"><option value="" selected="selected">Select</option><option value="science">science</option><option value="english">english</option></select>
</form>

<script type="text/javascript">
  function validate_forms() {
        $('form.addclass input').each(function () {
      if (name == 'name') {
                $(this).rules('add', {
                    required: true
                });
            }
     });

     $('form.addclass select').each(function () {
      var name = $(this).attr('name');
        $(this).rules('add', {
        required_select: true
        });
      });

      $.validator.addMethod('required_select', function (value, element) {
      return value > 0;
      }, 'Please choose an option');

     
  }

 $("form#frmaddclass").validate({
        submitHandler: function (form) {

..
});
<script>

 $(function() {

        $("form#frmaddclass").validate({
            submitHandler: function(form) {
                alert("form valid");
                return false;
            }
        });

        $('select').each(function() {
            $(this).rules('add', {
                messages: {
                    required: "custom select message"
                }
            });

        });

    });
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/jquery-validation@1.19.2/dist/jquery.validate.js"></script>

    <form method="POST" action="http://localhost:8000/admin/add" accept-charset="UTF-8" class="form-horizontal addclass" id="frmaddclass" enctype="multipart/form-data" novalidate="novalidate">

        <input class="form-control error" placeholder="Name" id="name" required="" name="name" type="text" value="" aria-invalid="true"><br/>

        <select class="form-control" required="" name="status">
            <option value="" selected="selected">Select</option>
            <option value="active">active</option>
            <option value="disabled">inactive</option>
        </select><br/>
        <select class="form-control" required="" name="subject[ETET][]">
            <option value="" selected="selected">Select</option>
            <option value="science">science</option>
            <option value="english">english</option>
        </select><br/>
        <select class="form-control" required="" name="subject[ETET][]">
            <option value="" selected="selected">Select</option>
            <option value="science">science</option>
            <option value="english">english</option>
        </select>
        <select class="form-control" required="" name="subject[ETET][]">
            <option value="" selected="selected">Select</option>
            <option value="science">science</option>
            <option value="english">english</option>
        </select>
        <br/>
        <input type="submit" />
    </form>

Now issue is when i add required to the input and select field then only the form is validated, but when i select any option then the error should be removed but validation error is there after i select value. I dont't want to add required to the fields for validation.

来源:https://stackoverflow.com/questions/62580803/cannot-validate-dynamic-fields-using-jquery-validator

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!