選択されたフィールドが選択されていることを確認してください。

Question

フォームに複数の選択があり、少なくともすべての必須フィールド（required="true"）が選択されていることをjQueryで確認する必要があります。このような

何か：

<select class="check" name="first"> 
    <option value="some" required="true">Some required</option> 
    <option value="other">Other Value</option> 
    <option value="few" required="true">Few required</option> 
</select> 
<select class="check" name="second"> 
    <option value="some" required="true">Some required</option> 
    <option value="other">Other Value</option> 
    <option value="few" required="true">Few required</option> 
</select> 
<select class="check" name="third"> 
    <option value="some" required="true">Some required</option> 
    <option value="other">Other Value</option> 
    <option value="few" required="true">Few required</option> 
</select> 
<select name="other"> 
    <option value="some" required="true">Some required</option> 
    <option value="other">Other Value</option> 
    <option value="few" required="true">Few required</option> 
</select> 

私は、そのクラス.checkが含まれており、すべての必須フィールドが割り当てられていることを確認して、すべての選択の要素をチェックする必要があります。

私は次のように進んでいます。

1. 必要なすべての値の配列行います

   var requiredFields = []; 
   $('option:selected', this).attr('required').each(function(){ 
       requiredFields.push($(this).val()); 
   }) 
   

2. が選択されたすべての値の配列を作成します。

   var valuesSelected = []; 
   $('.check').each(function(){ 
       valuesSelected.push($(this).val()); 
   }) 
   

3. チェック必須フィールドが選択された値である場合配列、何かしない場合：

   for(i=0;i<requiredFields;i++){ 
       if(jQuery.inArray(requiredFields[i], valuesSelected)==-1){ 
        var error += 'Please select '+requiredFields[i]; 
       } 
   } 
   

4. エラーメッセージを表示、または空が何かない場合：

   if(error!=''){ 
       alert(error); // just for testing 
   } else { 
       // have fun 
   } 
   

を、私はそれをテストするための簡単なjsFiddleを設置しましたが、私が何か間違ったことしなければならないようで、任意のヘルプ？

Answer 1

マップ更新 http://jsfiddle.net/4vNcU/4/

$(document).on('click', '.check-select', function() { 
var error = $(".check").find("option:selected").map(collectErrors); 
for (var i = 0; i < error.length; i++) { 
    alert(error[i]); 
} 
}); 

function collectErrors() { 
    if ($(this).attr("required") == undefined) { 
     var $parent = $(this).parent(); 
     return "Please select one of the folowing:" + 
     findRequired($parent) + 
     " For the select box " + $parent.attr("name"); 
    } 
} 

function findRequired($parent) { 
    return $parent.find("option[required=true]").map(function() { 
     return $(this).text(); 
    }).toArray().join() 
} 

Answer 2

あなたは配列を作成したり、javascriptのような配列に要素を追加したりしません。

requiredFields.push($(this).val()); 

Answer 3

と

var requiredFields = []; 

と

requiredFields[]=$(this).val(); 

と

var requiredFields = array(); 

が見つかり交換ソリューション、私は間違って多くの事をしていた：

var requiredFields = []; 
    $(form).find('option[required]').each(function(){ 
     if(jQuery.inArray($(this).html(), requiredFields)==-1){ 
      requiredFields.push($(this).html()); 
     } 
    }) 
    var valuesSelected = []; 
    $(form).find('option:selected').each(function(){ 
     valuesSelected.push($(this).html()); 
    }) 
    for(i=0;i<requiredFields.length;i++){ 
     if(jQuery.inArray(requiredFields[i], valuesSelected)==-1){ 
      var msgErr2 = msgErr2 + 'Please select '+requiredFields[i]+'<br>'; 
     } 
    } 

この1つはうまく動作し、誰かを助けることを願って！