Jqueryのバリデーションについて

Question

私はjqueryの検証をselectフィールドに入れました。フィールド名はname = "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); 
     } 
     } 
    } 
    });