title: Select box with 'Other' option to display input text field. How to get value back for form submission using jquery?
body: <p>I've got a form with the following select box:</p>
  
  <pre><code>&lt;fieldset id="workers_comp_info"&gt;
    &lt;p&gt;
      &lt;label for="i_n_r_reason"&gt;Reason why Workers Comp Insurance is not required:&lt;/label&gt;
      &lt;select name="i_n_r_reason" id="i_n_r_reason"&gt;
        &lt;option value="No employees"&gt;No employees&lt;/option&gt;
        &lt;option value="1-2 employees"&gt;1-2 employees&lt;/option&gt;
        &lt;option value="Other"&gt;Other(Specify reason)&lt;/option&gt;
      &lt;/select&gt;
      &lt;input id="other_reason" name="other_reason" type="text" placeholder="Other Reason" /&gt;
    &lt;/p&gt;
  &lt;/fieldset&gt;
  </code></pre>
  
  <p>I've written the following jquery code to hide the "other_reason" text field unless "Other" is selected in the select box.</p>
  
  <pre><code>$('#i_n_r_reason').change(function() {
    $('#other_reason').toggle($(this).val()=='Other');
  }).change();
  </code></pre>
  
  <p>I am creating a jquery method called SubmitForm.  I want to write something like this:</p>
  
  <pre><code>function SubmitForm() {
    if ($('#i_n_r_reason').val()=='Other')
      ('#i_n_r_reason').val = ('#other_reason').val
    ('#account_form').submit();
  }
  </code></pre>
  
  <p>When the user selects 'Other', the text field is displayed for them to enter a reason.  I want this reason to override 'Other' when the user submits the form. But its not happening with this code.  Any suggestions?</p>