2012-04-15 5 views
0

私の投稿にコメント機能を追加したいと思います。jQuery submit()は一度しか起こらない、もっと起こるはずです

def create 
    @comment = Comment.new(params[:comment]) 
    @snippet = @comment.snippet 
    @comment.save 
    @comment = Comment.new 
    render :partial => "snippets/comment" 
    end 

Javascriptを: は、ここで私が呼び出しています作成方法です私はかつてコメントを追加することができ、部分的には、リロードせずにレンダリングされますが、私は他のコメントを追加する際には、一部だけ(何も)をレンダリングしません。

$(document).ready(function(){ 
    save_comment(); 
}); 
function save_comment() { 
    $("#new_comment").submit(function (e) { 
     e.preventDefault(); 
     var url = "/comments/create"; 
     var post_data = $('#new_comment').serialize(); 
     logger(post_data); 
     post_data = add_auth_token(post_data); // add authenticity token to post for forgery protection (works fine) 
     $.post(url, 
      post_data, 
      function(data) { 
       $("#comments_container").html(data); 
       $("#comment_value").val(""); 
      }); 
    }); 
} 

、フォーム

<%= form_for(@comment) do |f| %> 
    <%= f.text_field :value %> 
    <%= f.hidden_field :user_id, :value => current_user.id %> 
    <%= f.hidden_field :snippet_id, :value => @snippet.id %> 
    <div class="actions"> 
    <%= f.submit "Post" %> 
    </div> 
<% end %> 

答えて

1

イベントリスナーコードは、それがABLない実行された後にHTMLが追加されているのでe後でDOMに追加される要素のsubmitのイベントハンドラを添付します。イベントをバインドするにはon APIを使用する必要があり、後でドキュメントに追加される子孫要素のイベントを処理できる委任イベントハンドラが追加されます。

$(document).ready(function(){ 
    save_comment(); 
}); 
function save_comment() { 
    $(document).on("submit","#new_comment",function (e) { 
     e.preventDefault(); 
     var url = "/comments/create"; 
     var post_data = $('#new_comment').serialize(); 
     logger(post_data); 
     post_data = add_auth_token(post_data); // add authenticity token to post for forgery protection (works fine) 
     $.post(url, 
      post_data, 
      function(data) { 
       $("#comments_container").html(data); 
       $("#comment_value").val(""); 
      }); 
    }); 
} 
:あなたがあなたのコードを変更する必要がありますあなたの場合は

関連する問題