jQueryを使用して私のアンケートを検証する

Question

私は非常に基本的なアンケートを作成しました。すべての質問がデータベースに提出される前に完了していることを検証する必要があります。いくつかの調査をして、私はこの質問が何度も何度も何度も尋ねられたことを知りました。これで唯一の問題はある

$(document).on('submit', 'form', function() { 

    var validate = true; 
    var unanswered = new Array(); 

    // Loop through available sets 
    $('.option').each(function() { 
     // Question text 
     var question = $(this).prev().text(); 
     // Validate 
     if (!$(this).find('input').is(':checked')) { 
      // Didn't validate ... dispaly alert or do something 
      unanswered.push(question); 

      validate = false; 
     } 
    }); 

    if (unanswered.length > 0) { 
     msg = "Please answer the following questions:\n" + unanswered.join('\n'); 
     alert(msg); 
    } 
    return validate; 
}); 

の下に私の要件に答えるに来る最も近いものは、スクリプトは、すべてのラジオボタンをループしているだけではなく、それは、それを警戒して何の確認答えを持っていない質問が表示されません

答えを返すだけで未回答の質問が表示されるようにコードを編集するのに役立つ人はいますか？私は答えの周りに別のdivを追加することができると思ったが、それは役に立たなかった。私はかなりそれが​​だと確信していますが、編集する必要がありますが、ちょうど質問そのものを取得する方法はわかりません。

私のhtmlコード

<div class="question option">Question Test 1<br> 
    <input name="question[1]" type="hidden" value="Test 1 required"> 
    <div class="answer"> 
     <input name="answer[1]" type="radio" value="Strongly agree">Strongly agree<br> 
     <input name="answer[1]" type="radio" value="Agree">Agree<br> 
     <input name="answer[1]" type="radio" value="Disagree">Disagree<br> 
     <input name="answer[1]" type="radio" value="Strongly disagree">Strongly disagree<br> 
     <input name="id" type="hidden" value="9AE9CBA7"> 
    </div> 
</div> 
<div class="question option">Question Test 2<br> 
    <input name="question[2]" type="hidden" value="Test 2 required"> 
    <div class="answer"> 
     <input name="answer[2]" type="radio" value="Strongly agree">Strongly agree<br> 
     <input name="answer[2]" type="radio" value="Agree">Agree<br> 
     <input name="answer[2]" type="radio" value="Disagree">Disagree<br> 
     <input name="answer[2]" type="radio" value="Strongly disagree">Strongly disagree<br> 
     <input name="id" type="hidden" value="9AE9CBA7"> 
    </div> 
</div> 
<div class="question option">Question Test 3<br> 
    <input name="question[3]" type="hidden" value="Test 3 required"> 
    <div class="answer"> 
     <input name="answer[3]" type="radio" value="Strongly agree">Strongly agree<br> 
     <input name="answer[3]" type="radio" value="Agree">Agree<br> 
     <input name="answer[3]" type="radio" value="Disagree">Disagree<br> 
     <input name="answer[3]" type="radio" value="Strongly disagree">Strongly disagree<br> 
     <input name="id" type="hidden" value="9AE9CBA7"> 
    </div> 
</div> 

Answer 1

あなたは選択することが簡単にするために、質問文の周りspanを追加することができます。

<div class="question"> 
    <span class="label">Question Test 1</span><br> 
    <input name="question[1]" type="hidden" value="Test 1 required"> 
    <input name="answer[1]" type="radio" value="Strongly agree">Strongly agree<br> 
    <input name="answer[1]" type="radio" value="Agree">Agree<br> 
    <input name="answer[1]" type="radio" value="Disagree">Disagree<br> 
    <input name="answer[1]" type="radio" value="Strongly disagree">Strongly disagree<br> 
    <input name="id" type="hidden" value="9AE9CBA7"> 
</div> 

だから、jQueryの

$('.question').each(function() { 
    //find span element within div.question with class 'label' and get the text 
    var question = $(this).find('span.label').text(); 

    //rest of code... 
}); 

なり