How to test all radio button / check box were checked before submit form

Question

I have used form_tag to build a form, which display questions and answers for user can check. This is my form:

<%= form_tag({ controller: 'exams', action: 'check_results' }, authenticity_token: true) do %>
  <ol class="questions">
    <% @questions.each do |question| %>
  <li class="content_question"><%= kramdown question.content %></li>

  <ol class="answers">
    <% question.answers.shuffle.each do |answer| %>
      <table class="answer_contents">
        <tbody>
      <tr>
        <% if question.question_type.shorcut == 'MC' %>
          <td><%= check_box_tag "user_answer_ids[#{question.id}][]", answer.id, false, id: "user_answer_ids_#{answer.id}" %></td>
          <td><li></li></td>
          <td><%= label_tag "user_answer_ids_#{answer.id}", kramdown(answer.content) %></td>
        <% else %>
          <td><%= radio_button_tag "user_answer_ids[#{question.id}][]", answer.id, false, id: "user_answer_ids_#{answer.id}" %></td>
          <td><li></li></td>
          <td><%= label_tag "user_answer_ids_#{answer.id}", kramdown(answer.content) %></td>
        <% end %>
      </tr>
       </tbody>
      </table>
    <% end %> <%# question.answers %>
  </ol> <%# ol.answers %>
  <br>
   <% end %> <%# @questions %>
   </ol> <%# ol.questions %>
  <%= submit_tag "Finish Exam", disable_with: "Checking results...", confirm: "Are you sure?", class: "btn btn-primary" %>
<% end %> <%# form_tag %>

I want to check if user forget to check some questions, when they press submit, it will have a alert for user to check miss question. Anyone can help/guide me how can I do that with javascript or jquery? Thanks.

HTML Code generated

This is html for one question and its answers, with radio select. With checkbox, it has different is, has more table element, and type in input is checkbox instead of radio.

<li class="content_question"><p>What is the term used to describe a framework of the phase involved in developing information systems?</p>
</li>
<ol class="answers">
  <table class="answer_contents">
    <tbody>
      <tr>
        <td><input id="user_answer_ids_663" name="user_answer_ids[186][]" type="radio" value="663"></td>
        <td><li></li></td>
        <td><label for="user_answer_ids_663"><p>systems development life cycle (t)</p></label></td>
      </tr>
    </tbody>
  </table>
  <table class="answer_contents">
    <tbody>
      <tr>
        <td><input id="user_answer_ids_664" name="user_answer_ids[186][]" type="radio" value="664"></td>
        <td><li></li></td>
        <td><label for="user_answer_ids_664"><p>extreme programing</p></label></td>
      </tr>
    </tbody>
  </table>
  <table class="answer_contents">
    <tbody>
      <tr>
        <td><input id="user_answer_ids_665" name="user_answer_ids[186][]" type="radio" value="665"></td>
        <td><li></li></td>
        <td><label for="user_answer_ids_665"><p>rapid application development</p></label></td>
      </tr>
    </tbody>
  </table>
  <table class="answer_contents">
    <tbody>
      <tr>
        <td><input id="user_answer_ids_666" name="user_answer_ids[186][]" type="radio" value="666"></td>
        <td><li></li></td>
        <td><label for="user_answer_ids_666"><p>predictive life cycle</p></label></td>
      </tr>
    </tbody>
  </table>
</ol>

Answer 1

The example below adds a handler to the form myForm's submit event so you need to give your form the ID myForm. This checks that each question has one of it's possible answers checked. It works for both radio and checkbox answers. If validation fails, it alerts the list of questions that are missing an answer, then prevents the form from submitting.

$(document).ready(function(){
    $('#myForm').submit(function(){

        var errors = [];

        $('.content_question').each(function(){

            var answerCont = $(this).next();
            var inputs = $(answerCont).find('input[type=radio], input[type=checkbox]');

            if(inputs.length > 0)
            {
                var groupChecked = false;

                $(inputs).each(function(){
                    if($(this).is(':checked'))
                    {
                        groupChecked = true;
                    }
                });

                if(!groupChecked)
                {
                    errors.push($(this).text().trim());
                }
            }
        });

        if(errors.length > 0)
        {
            var errorMessage = "You missed " + errors.length + " questions: \n\n";

            for(var i=0; i<errors.length; i++)
            {
                errorMessage += errors[i] + "\n";
            }
            alert(errorMessage);
            return false;
        }
    });
});