Checkbox value not submitting

Question

EDIT The form, and checkbox submits completely fine in Internet Explorer 8. In IE 10, and Chrome 34.0 it doesn't get submitted

Ok, this one has me stumped. I have a form, each form contains one question for a quiz, its possible answers, and a checkbox to select which is the correct answer.

<form action="/department/update_quiz_question/1/1/5" method="post" class="form-horizontal form-bordered form-row-stripped" id="question_form_5">
  <tr id="question_5">
    <td class="col-md-4">
      <textarea name="quiz_question" class="form-control" rows="4">What letter precedes B?</textarea>
    </td>

    <td class="col-md-5">
      <div class="input-group ">
        <input type="text" class="col-md-5 form-control" name="answer[]" value="A">
        <span class="input-group-addon">
          <input type="checkbox" checked="checked" name="correct_answer[]" value="A">
        </span>

        <span class="input-group-btn">
          <button class="btn red btn-delete-answer" type="button" data-question-id="5" data-answer="A"><i class="fa fa-trash-o"></i></button>
        </span>
      </div>
    </td>

    <td class="col-md-3">
      <a href="javascript:;" class="btn btn-sm blue btn-add-answer-existing" data-question-id="5">Add Answer</a> 
      <a href="javascript:;" class="btn btn-sm green btn-update-question" data-question-id="5">Update</a> 
      <a href="javascript:;" class="btn btn-sm red btn-delete-question" data-question-id="5">Delete</a>
    </td>
  </tr>
</form>

When I submit the form, it goes to a Codeigniter method which only contains:

print_r($_POST);
var_dump($this->input->post('correct_answer'));

As you can see, the checkbox is most certainly checked. It is also checked visually (IE there is a tick in the box).

When I submit the form, it goes through a jquery checking script. If all passes, jquery submits the form.

Just before I submit the form, I log the value of the checked checkbox, using the following:

console.log($(".input-group input[name^='correct_answer']:checked").val());

Which, as you would expect, outputs A, or whichever answer is ticked. So I know for certain the checkbox is ticked.

However, Codeigniter outputs the following:

Array ( [quiz_question] => What letter precedes A? [answer] => Array ( [0] => A ) )
bool(false)

The array is from the raw $_POST data. bool(false) is outputted from $this->input->post('correct_answer');.

As you can see, the checkbox value for correct_answer is not even displaying in raw $_POST data.

I can't understand what I've done wrong. I have an identical form when I create a new question, and that works perfectly fine.

Can anyone see any obvious mistakes? Or am I doing something wrong? Many thanks

EDIT

This is what I've tried so far:

• Removing all the span elements around the checkbox, leaving just the text input and the checkbox input - Still not checkbox value in the post data
• removed the square brackets around the checkbox name - no post data
• renamed the checkbox name, no post data
• Submitted the form straight away instead of passing through a jquery check first, no post data
• Changed it from a checkbox to a radio button - no post data
• changed it from checkbox to text, - works, doesnt work when its a radio or checkbox

Answer 1

Your HTML code is invalid – you can not have a form element as child of table.

Either put the whole table into the form, or the whole form inside a td element – these are your only two options.¹

Different error correction algorithms for faulty HTML most likely explain why you see your current code working in a certain browser, but not in others.

---

¹ Well, if you want to stick to a table anyway – as you said in comments, moving away from using a table resolved that structural issue as well.