Wie jQuery Form Plugin mit Rails js.erb Vorlage verwenden?

Question

Ich verwende das jQuery Form Plugin mit meiner Rails App. Ich habe eine Form wie folgt aus:

<form action="/comments" id="comment_form" method="post"> 
    <textarea cols="60" id="comment_comment" name="comment[comment]" rows="3"></textarea> 
    <input id="comment_submit" name="commit" type="submit" value="Add comment" /> 
</form> 

Meine application.js Datei hat:

jQuery.ajaxSetup({ 
    'beforeSend': function(xhr) {xhr.setRequestHeader("Accept", "text/javascript")} 
}); 

$(document).ready(function(){ 
    $("#comment_form").ajaxForm(); 
}); 

Meine Kommentare Controller ist wie folgt:

def create 
    @comment = Comment.new(params[:comment]) 

    respond_to do |wants| 
    if @comment.save 
     flash[:notice] = 'Added comment.' 
     wants.js 
    end 
    end 
end 

und ich habe einige jQuery-Code in/ansichten/kommentare/create.js.erb wie:

$("#comment_form).hide(); 

und einige andere Sachen.

Mein Problem ist der jQuery-Code innerhalb von create.js.erb passiert nie (d. H. Das Formular wird nicht ausgeblendet). Wenn ich dies stattdessen in application.js verwende (dank Railscast für diesen Code)

jQuery.fn.submitWithAjax = function() { 
    this.submit(function() { 
    $.post(this.action, $(this).serialize(), null, "script"); 
    return false; 
    }) 
    return this; 
}; 

jQuery.ajaxSetup({ 
    'beforeSend': function(xhr) {xhr.setRequestHeader("Accept", "text/javascript")} 
}); 

$(document).ready(function(){ 
    $("#comment_form").submitWithAjax(); 
}); 

alles funktioniert gut. Der ganze Code in create.js.erb funktioniert großartig! Ich würde lieber das jQuery Form-Plugin verwenden, aber ich verstehe nicht, wie create.js.erb-Code ausgeführt werden kann. Wenn Sie etwas tun wie:

$("#comment_form").ajaxForm({success: function(){$("comment_form").hide()}}); 

dann funktioniert dieser jQuery-Code. Aber ich muss die Erb-Vorlage ausführen (weil ich Dinge wie ein Teil nach innen rendern).

Danke für irgendwelche Einblicke.

Answer 1

Ich habe das herausgefunden. Während dieses Screen beobachten http://blog.edgecase.com/2009/6/15/ajax-file-uploads-made-easy-screencast - ich bemerkte, dass er datatype hinzugefügt: 'script' Anstatt also

$("#comment_form").ajaxForm(); 

Ich brauchte

$("#comment_form").ajaxForm({dataType: 'script'}); 

Works! Und es ist genau dort in der jQuery Form docs - "if dataType == 'script' wird die Serverantwort im globalen Kontext ausgewertet"