不显眼的javascript rails 3.1多种形式，同一页面答案

【问题标题】：unobtrusive javascript rails 3.1 multiple forms, same page不显眼的javascript rails 3.1多种形式，同一页面
【发布时间】：2012-02-01 19:06:13
【问题描述】：

我对同一页面中的多个表单很着迷。

当有一个唯一的表单时一切正常，您可以识别此表单或列的唯一 ID 或唯一类...等等。

但是当我在同一页面中有多个表单时，我的大问题又回来了。我想在创建新评论时渲染部分 create_index，在 create.js.erb 我有：

$("<%= escape_javascript(render 'create_index') %>").hide().prependTo(".comments_column").fadeIn(1500);

问题在于，如果表单上方有许多列具有 .cmets_column 类，则注释会在具有相同类的每一列中呈现。

jquery 中的一个例子是这样的：

http://jsfiddle.net/minitech/aC92Q/8/

对于 rails 3.1，此示例不适用。如果我把那个 javascript 放在 create.js.erb 中。第一次不显示创建的评论。

如果我只放入 create.js.erb：

$("<%= escape_javascript(render 'create_index') %>").hide().prependTo(".comments_column").fadeIn(1500);

在包含类 .cmets_column 的每一列中呈现部分。

我的问题是 How to say to rails 3 我被击中的表单或按钮仅在此列中呈现部分内容？

【问题讨论】：

标签： ruby-on-rails ruby-on-rails-3 unobtrusive-javascript

【解决方案1】：

问题已解决！对于每个存在此问题的世界：

每个 rails UJS AJAX 调用都提供了六个可以附加到的自定义事件：

ajax:before – right before ajax call
ajax:loading – before ajax call, but after XmlHttpRequest object is created)
ajax:success – successful ajax call
ajax:failure – failed ajax call
ajax:complete – completion of ajax call (after ajax:success and ajax:failure)
ajax:after – after ajax call is sent (note: not after it returns)

在我的例子中，我将在我的提交按钮上的 ajax:success 事件中添加一个事件监听器：

$('.comment_box form').bind('ajax:success', function() {  

   $("<%= escape_javascript(render(:partial => 'create_index'))%>").hide().prependTo($(this).parents(".comments_column").eq(0)).fadeIn(1500); 
});

调用自定义事件非常重要，否则对方不能正常工作。

【讨论】：