2011-07-18 14 views
1

FadeOutエフェクトが終了した後にのみajaxコールを作成したいと思います。Rails - ビジュアルエフェクトが完了した後にのみAjaxを呼び出す

<script type="text/javascript"> 
function closeIt(id) { 
    $(id).slideUp();   
} 
</script> 

<%= link_to_remote('Delete', :url => {:action => "ajaxdestroy", :controller => "blog_comments", :blog_post_id => @blog_post.id, :id => comment.id}, :before => "closeIt('comment#{comment.id}')", :update => "blogPostComments", :confirm => 'Are you sure?') %></p> 

今生成されたHTMLは以下のようになります。:

<a onclick="if (confirm('Are you sure?')) { closeIt('comment39'); new Ajax.Updater('blogPostComments', '/blog_comments/ajaxdestroy/39?blog_post_id=6', {asynchronous:true, evalScripts:true, parameters:'authenticity_token=' + encodeURIComponent('Xzvq2/0BlbVi3eVCxW5TGcKmap3nrVC1SiG76W+bVGc=')}); }; return false;" href="#">Delete</a> 

ので、効果のcloseit関数が呼び出されるが、AJAX呼び出しがslideUp効果の前に終了している私の簡単なコードです 。以前のcloseIt関数のコールバックでAjax関数を呼び出すにはどうすればよいですか?

おかげ

答えて

2

使用

<a onclick="return closeThat(39);" href="#">Delete</a> 



function closeThat(id) { 
    if (confirm('Are you sure?')) { 
     closeIt('comment'+id, function() { 
      new Ajax.Updater('blogPostComments', '/blog_comments/ajaxdestroy/'+id+'?blog_post_id=6', { 
       asynchronous: true, 
       evalScripts: true, 
       parameters: 'authenticity_token=' + encodeURIComponent('Xzvq2/0BlbVi3eVCxW5TGcKmap3nrVC1SiG76W+bVGc=') 
      }); 
     }); 
    } 
    return false; 
} 


function closeIt(id, callback) { 
    $(id).slideUp(400, callback);   
} 
+0

ありがとうChristopheですが、このJavaScriptコードをどのようにしてレールコードから生成できますか?実際にはjavascriptコードが自動的に生成されます – coorasse

+0

"レールコードから生成された"とはどういう意味ですか? => "blog_post_id => @ blog_post.id、:id => comment.id}::" blog_comments "、:blog_post_id => @ blog_post.id、: – alste

+0

<%= link_to_remote( '削除'、:url => {:アクション=>" ajaxdestroy "あなたは本当ですか? ')%>はjavascriptコードを生成します。>> "closeIt(' comment#(comment.id) ')"、:update => "blogPostComments"私はAjaxコールの前に呼び出されるjavascript関数を定義するために:beforeシンボルを使うことができますが、Ajaxコールを:before関数のコールバックとして呼び出す方法を知らない – coorasse

1

[OK]を、私は、作成された後ではJavaScriptを使用して解決しました。私は削除:はlink_to_remoteからシンボルを確認し、生成された要素

<%= link_to_remote 'Cancella', {:url => {:action => "ajaxdestroy", 
              :controller => "blog_comments", 
              :blog_post_id => @blog_post.id, 
              :id => comment.id}, 
           :update => "blogPostComments"}, 
           {:id => "delete#{comment.id}"} %></p> 

    <script> 
     var onClick<%=comment.id%> = new Function($('#delete<%= comment.id%>').attr('onClick')); //get the ajax call autogenerated   
     function nuova() { //define a new function to wrap it 
       if (confirm('Are you sure?')) { //move here the confirm message 
        $('#comment<%= comment.id%>').hide(600,onClick<%=comment.id%>); 
       } 
       return false;  
    }         
     $('#delete<%= comment.id%>').removeAttr('onclick').click(nuova); 
    </script> 
ないクリーン

が、それが解決策だの「ID」フィールドを追加しました:前に。今度は、エフェクトが終了した後にのみDelete ajaxコールが送信されます

関連する問題