title: How do I bind a Jquery submit to a form_tag form submission action in rails
body: <p>In my rails app I'm submitting a range of forms via AJAX - normally via a modal. In order to do so I use the following code:</p>
  
  <pre><code>$(document).ready(function(){
    $(form).on('submit', function(event) {
    form = $(this).attr('id');
    selector = $('form#' + form)
    $(document).bind('ajaxError', selector, function(event, jqxhr, settings, exception){
      // note: jqxhr.responseJSON undefined, parsing responseText instead
      $(event.data).render_form_errors( $.parseJSON(jqxhr.responseText) );
    });
  });
  </code></pre>
  
  <p>This pulls any error messages and runs them through the <code>render_form_errors</code> function which then posts the errors to an error block on the form. </p>
  
  <p>In order to render the code in a more attractive way I've started using "form_tag" submission in Rails:</p>
  
  <pre><code> &lt;%= form_tag('/sale_qualifiers', method: :post, remote: true) do -%&gt;
      &lt;%= fields_for :sale_qualifier do |ff| %&gt;
      &lt;%= ff.hidden_field :sales_opportunity_id, :value =&gt; @sales_opportunity.id %&gt;
          &lt;%= ff.hidden_field :question_id, :value =&gt; @question.id %&gt;
            &lt;tr id="form#sale_qualifier_submit"&gt;
              &lt;td&gt;&lt;%= @question.question_text %&gt;&lt;/td&gt;
          &lt;td&gt;
          &lt;%= ff.fields_for :answer_attributes do |answer| %&gt;
              &lt;div class="form-group"&gt;
              &lt;% if @question.answer_type == 'Text Field' %&gt;
                  &lt;%= answer.text_area :answer_text, :placeholder =&gt; "Enter your answer"%&gt;
              &lt;% end %&gt;
              &lt;% if @question.answer_type == 'Datetime' %&gt;
                  &lt;div class='input-group date' id='datetimepicker' data-date-format="YY.MM.DD"&gt;
                  &lt;%= answer.text_field :answer_text, class: "form-control", data: { date_format: 'YYYY/MM/DD' }, :placeholder =&gt; "YYYY/MM/DD" %&gt;
                  &lt;span class="input-group-addon"&gt;
                  &lt;span class="glyphicon glyphicon-calendar"&gt;&lt;/span&gt;
                  &lt;/span&gt;
              &lt;/div&gt;
          &lt;% end %&gt;
          &lt;% if @question.answer_type == 'Boolean' %&gt;
              &lt;%= answer.select :answer_text, [['Yes', true], ['No', false]] %&gt;
          &lt;% end %&gt;
              &lt;span class="warning-block"&gt;&lt;/span&gt;
              &lt;span class="help-block"&gt;&lt;/span&gt;
              &lt;/div&gt;
          &lt;% end %&gt;
              &lt;/td&gt;
              &lt;td&gt;
                  &lt;%= submit_tag "Submit", class: "btn btn-large btn-success", id: "sale_qualifier_submit", data: { disable_with: "Submitting..." }, autocomplete: 'off' %&gt;
              &lt;/td&gt;
          &lt;/tr&gt;
      &lt;% end %&gt;     
  &lt;% end %&gt;  
  </code></pre>
  
  <p>The result of this code is that the <code>submit_tag</code> does not sit within the form in the produced html - which it does when the <code>form_for</code> method is used. As such my Jquery doesn't bind to the submit action, and the code:</p>
  
  <pre><code>$(form).on('submit', function(event) {
    form = $(this).attr('id');
    selector = $('form#' + form)
  </code></pre>
  
  <p>Doesn't work either - because the entire form has a different set of ids and classes when using form_tag and they don't fit together organically like they do when Rails produces the entire form.</p>
  
  <p>Can anyone suggest a Jquery method to grab the closest form-group to the submit button on submit, then bind this action to it if there's an AjaxError?</p>
  
  <p>Do let me know if you need more info to help out.</p>