Wie binde ich eine Jquery-Submit an eine form_tag-Formular-Submission-Aktion in Rails

Question

In meiner Rails-App reiche ich eine Reihe von Formularen über AJAX ein - normalerweise über ein Modal. Um verwende ich zu tun so den folgenden 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)); 
    }); 
}); 

Dies zieht alle Fehlermeldungen und führt sie durch die render_form_errors Funktion, die dann die Fehler in einen Fehlerblock an der FORMULARPLZ.

Um den Code in einer attraktiveren Art, wie ich mit „form_tag“ Unterwerfung in Rails habe zu machen begonnen:

<%= form_tag('/sale_qualifiers', method: :post, remote: true) do -%> 
    <%= fields_for :sale_qualifier do |ff| %> 
    <%= ff.hidden_field :sales_opportunity_id, :value => @sales_opportunity.id %> 
     <%= ff.hidden_field :question_id, :value => @question.id %> 
      <tr id="form#sale_qualifier_submit"> 
      <td><%= @question.question_text %></td> 
     <td> 
     <%= ff.fields_for :answer_attributes do |answer| %> 
      <div class="form-group"> 
      <% if @question.answer_type == 'Text Field' %> 
       <%= answer.text_area :answer_text, :placeholder => "Enter your answer"%> 
      <% end %> 
      <% if @question.answer_type == 'Datetime' %> 
       <div class='input-group date' id='datetimepicker' data-date-format="YY.MM.DD"> 
       <%= answer.text_field :answer_text, class: "form-control", data: { date_format: 'YYYY/MM/DD' }, :placeholder => "YYYY/MM/DD" %> 
       <span class="input-group-addon"> 
       <span class="glyphicon glyphicon-calendar"></span> 
       </span> 
      </div> 
     <% end %> 
     <% if @question.answer_type == 'Boolean' %> 
      <%= answer.select :answer_text, [['Yes', true], ['No', false]] %> 
     <% end %> 
      <span class="warning-block"></span> 
      <span class="help-block"></span> 
      </div> 
     <% end %> 
      </td> 
      <td> 
       <%= submit_tag "Submit", class: "btn btn-large btn-success", id: "sale_qualifier_submit", data: { disable_with: "Submitting..." }, autocomplete: 'off' %> 
      </td> 
     </tr> 
    <% end %>  
<% end %> 

Das Ergebnis dieses Code ist, dass die submit_tag nicht in der Form nicht sitzt in das erzeugte HTML - was es tut, wenn die form_for Methode verwendet wird. Als solche meine Jquery bindet nicht an der Aktion vorzulegen, und der Code:

$(form).on('submit', function(event) { 
    form = $(this).attr('id'); 
    selector = $('form#' + form) 

funktioniert entweder nicht - weil die gesamte Form einen anderen Satz von IDs und Klassen hat, wenn form_tag verwenden und sie nicht passen organisch zusammen wie wenn Rails die gesamte Form produziert.

Kann irgendjemand eine Jquery-Methode vorschlagen, um die nächste Formulargruppe zur Übergabeschaltfläche beim Senden zu bringen, und dann diese Aktion an sie binden, wenn ein AjaxError vorliegt?

Lassen Sie mich wissen, wenn Sie weitere Informationen benötigen, um zu helfen.

Answer 1

es ein bisschen „Hacky“ fühlt, aber ich habe diese Arbeiten durch den Link Geoffroy gepostet oben bekommen und nur durch meine Form direkt Targeting:

$('form').on('submit', function(event) { 
$(document).bind('ajaxError', 'form#new_sale_qualifier', function(event, jqxhr, settings, exception){ 
    // note: jqxhr.responseJSON undefined, parsing responseText instead 
    $(event.data).render_form_errors($.parseJSON(jqxhr.responseText)); 
    }); 
}); 

Explizit die richtigen Wähler erklären das Ereignis zu binden . Es wäre schöner, wenn ich diese Informationen aus dem HTML extrahieren könnte - ich denke, es wäre in Zukunft weniger anfällig für einen Bruch.