Prototype: Form.serialize missing some inputs (due to table?)

Posted by Chris on Stack Overflow See other posts from Stack Overflow or by Chris
Published on 2010-03-08T21:16:21Z Indexed on 2010/03/08 21:21 UTC
Read the original article Hit count: 202

Filed under:
|
|
|

I'm using JavaScript Prototype (through Ruby on Rails) to handle some Ajax calls; but in one particular case I'm missing a field from the form.

I have a layout like this:

+---------+---------+
| Thing 1 | Thing 2 |
+---------+---------+-----------+
| o Opt 1 | o Opt 1 | <Confirm> |
| o Opt 2 | o Opt 2 |           |
+---------+---------+-----------+

Opt 1 and 2 are Radio buttons, Confirm is a button. The entire table is wrapped in a form, with code like:

<form action="javascript:void(0)">
  <input type="hidden" name="context" value="foo" />
  <input type="hidden" name="subcontext" value="bar" />
  <table>
    <tr><td>Thing 1</td><td>Thing2</td></tr>
    <tr><td>
      <input type="radio" name="choice" value="1.1" />Opt 1<br />
      <input type="radio" name="choice" value="1.2" />Opt 2<br />
    </td><td>
      <input type="radio" name="choice" value="2.1" />Opt 1<br />
      <input type="radio" name="choice" value="2.2" />Opt 2<br />
    </td><td>
      <input name="choice_btn" type="button" value="Confirm"
             onclick="new AJAX.Updater('my_form', '/process_form',
                      {asynchronous:true, evalScripts:true,
                       parameters:Form.serialize(this.form)});
                       return false;" />
    </td></tr>
  </table>
</form>

But I can see that the POST generated by clicking the Confirm button contains the foo and bar values for the hidden fields, but not the choice of the radio buttons.

Is this because I've got a table inside my form? How can I get around this?

© Stack Overflow or respective owner

Related posts about prototype

Related posts about AJAX