如何使用jQuery Validation插件基於輸入type = text / radio / checkbox驗證表單

Question

我有一個包含動態生成字段的多步驟表單，需要使用jQuery進行驗證，這就是表單 。 我該如何實現？

// next step
    $('.form-horizontal .btn-next').on('click', function() {
        $("#multiphase").validate();

        $('input[type="text"]').each(function(){
            $(this).rule('add', {
                required: true,
                messages:{
                    required: "This field is required"
                }
            })
        })

    });

Answer 1

首先，您可以使用"name"屬性來驗證元素。 您可以顯示以下示例：

<script type="text/javascript">
  $("#pseudoForm").validate({
    onfocusout:true,
    rules:{
      first_name:"required",
      last_name:"required"
    }
  });
</script>
<!-- whatever -->
<div id="pseudoForm">
  <input type="text" name="first_name"/>
  <input type="text" name="last_name"/>
</div>

您也可以看到此鏈接的參考鏈接LINK

Answer 2

您應該將輸入字段映射到包含驗證插件規則的對象。 我假設您正在使用此： http : //jqueryvalidation.org/

這是一般的想法：

  var fields = {};
  $('form').find(':input').each(function() {
    fields[this.name] = "required";
  });

  $('form').validate({
    rules: fields
  });

當然，您必須多配置一些插件，但這至少是您處理動態字段的方式。 一種替代方法是在服務器端生成規則。