Wie kann ich ein Rails-Formular mit AJAX senden, aber auch eine jQuery-Aktion auslösen?

Question

Ich versuche, ein Rails-Formular mit AJAX einzureichen.

Ich habe einige ein-/ausschalten jQuery-Funktion, die einige Farbe auf grün und rot setzt, wenn jemand mag oder nicht mag.

Was ich versuche, ist es meine jQuery-Funktion aufrufen, um die Farbe umzuschalten und dann das Formular mit Ajax an eine Rails-Funktion mit dem Status Like/Ablehnen eingereicht.

Meine Form:

#wrapper_select.like_select 
    = form_for @paintings, :url => "/paintings/handlelike", :method => "post", :remote => true, :html => {:name => 'form'} do |f| 

     = hidden_field_tag :s_id, params[:id] 
     = hidden_field_tag :likes, params[:choice] 

jQuery Funktion:

$('.like_select').click(function() { 
    if (this.className.match(/like_yes|like_no/)) $(this).toggleClass('like_yes like_no'); 
    else $(this).toggleClass('like_yes'); 

    }) 

Wie kann ich die Toggle-js-Funktion (selbst die Funktion arbeitet in Ordnung) anrufen und senden Sie das Formular mit Ajax und dann den Wert wenn ein Benutzer mag/nicht mag?

Answer 1

Verwenden Sie ajaxsubmit Funktion von jquey.form Plugin dort können Sie eine andere Funktion aufrufen. Hier ist ein Link zu jquery.form Plugin.

http://jquery.malsup.com/form/

_ __ _ __ _ ___ _edit 2_ _ __ _ __ _ ___ __

= javascript_include_tag "jquery.form", "jquery.validate", "attachment_validation" 
= form_for @paintings, :url => "/paintings/handlelike", :method => "post", :remote => true, :html => {:id => "submit_form_id",:onsubmit => "return false;", :name => 'form'} do |f| 


    = submit_tag "submit", :class => "ClickClose", :id => "submit_form_btn" 

Ihre js

$("#submit_form_btn").click(function() { 
    //call your second function before submitting 

      $('#submit_form_id').submit(function() { 
      $(this).unbind('submit').ajaxSubmit({ 
       success: function(data) { 
       //do something on success case. 
       } 
      }) 
      return false 
      }); 
    }); 

Answer 2

ein Formular mit JQuery Ajax Einreichen erfordert zusätzliche Sachen zu behandeln.

1. Formularvalidierung
2. Werte sammeln und senden Sie es mit JQuery POST
3. Verarbeitung Antwort und Display-Meldung

besser zu sehen. Dies ist ein gutes Beispiel denke ich,

http://net.tutsplus.com/tutorials/javascript-ajax/submit-a-form-without-page-refresh-using-jquery/