關於jquery驗證

Question

我把jquery驗證選擇了字段，我把字段名稱命名爲「course []」。我把它放在數組中，因爲我想在表中存儲多個選擇的選項，但是當我在驗證中使用這個名稱時，我的驗證不能在選擇字段上工作，任何人都可以向我推薦任何解決方案。

我jQuery代碼是在這裏： -

 <script type="text/javascript"> 
     $("#formValidate").validate({ 
     rules: { 
     course:{ 
        required: true 
       }, 
      messages: { 
       course:{ 
        required: "Enter a username"; 
       }, 
      errorElement : 'div', 
      errorPlacement: function(error, element) { 
      var placement = $(element).data('error'); 
      if (placement) { 
       $(placement).append(error) 
      } else { 
       error.insertAfter(element); 
      } 
      } 
       }); 
      </script> 

我的HTML域代碼是在這裏： -

<form class="formValidate" id="formValidate" action="" method="POST"> 
<select multiple id="course" name="course[]"> 
<option value="Php">PHP</option> 
<option value="ruby">RUBY</option> 
<option value="wordpress">WORDPRESS</option> 
<option value="java">java</option> 
</select> 
</form> 

Answer 1

的問題是，你的字段名稱course[]，不course。因此，您需要將對象鍵包裝在引號中幷包含大括號。

另請注意，您的代碼有一些錯誤;您已將;置於一個語法錯誤的對象內，並且您錯過了一個關閉}。

$("#formValidate").validate({ 
 
    rules: { 
 
    'course[]': { // note the quotes and braces here 
 
     required: true 
 
    }, 
 
    messages: { 
 
     course: { 
 
     required: "Enter a username" 
 
     }, 
 
     errorElement: 'div', 
 
     errorPlacement: function(error, element) { 
 
     var placement = $(element).data('error'); 
 
     if (placement) { 
 
      $(placement).append(error) 
 
     } else { 
 
      error.insertAfter(element); 
 
     } 
 
     } 
 
    } 
 
    } 
 
});

<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> 
 
<form class="formValidate" id="formValidate" action="" method="POST"> 
 
    <select multiple id="course" name="course[]"> 
 
    <option value="Php">PHP</option> 
 
    <option value="ruby">RUBY</option> 
 
    <option value="wordpress">WORDPRESS</option> 
 
    <option value="java">java</option> 
 
</select> 
 
<button>Submit</button> 
 
</form>

Answer 2

如果使用陣列[]隨着'或"

("#formValidate").validate({ 
    rules: { 
    "course[]":{ 
       required: true 
      }, 
     messages: { 
      "course[]":{ 
       required: "Enter a username"; 
      }, 
     errorElement : 'div', 
     errorPlacement: function(error, element) { 
     var placement = $(element).data('error'); 
     if (placement) { 
      $(placement).append(error) 
     } else { 
      error.insertAfter(element); 
     } 
     } 
      }); 
     </script> 

Answer 3

見下面我更新的代碼添加字段名稱，它將打印驗證消息'Enter a username'，其上沒有顯示其他用戶的答案，因爲他們在代碼中錯過了}的rules。

$("#formValidate").validate({ 

    rules: { 
     'course[]': { required: true } 
    }, 

    messages: { 
     'course[]': { required: 'Enter a username' }, 
     errorElement: 'div', 
     errorPlacement: function(error, element) { 

     var placement = $(element).data('error'); 

     if (placement) { 
      $(placement).append(error); 
     } else { 
      error.insertAfter(element); 
     } 
     } 
    } 
    });