link_to 和 remote => true + jquery：怎么样？帮助？

Posted 2023-05-09

【中文标题】link_to 和 remote => true + jquery：怎么样？帮助？

【英文标题】：link_to and remote => true + jquery : How? Help?

【发布时间】：2011-10-26 12:42:03

【问题描述】：

我试图在我的 rails 网站的索引上创建一个“用户”链接，以便它显示注册用户 (User.all) 但我希望它作为部分显示在网站的右侧一个没有从一开始就加载整个页面的 div。

我知道这对于旧原型和远程是可能的 => true 但是对于 Rails 3.1 和 jQuery（和资产），我不知道该怎么做。

谁能帮助或告诉我教程的方法？

【参考方案1】：

这实际上很简单，因为它是新的，所以感觉很重要。基本上，有了新的不显眼的 javascript 支持，rails ujs 脚本公开了一组可以绑定 javascript 函数的事件，它们是：

ajax:beforeSend - 在发送发生之前触发 ajax:success - 发送后触发，包含响应 ajax:complete - 在成功事件后触发 ajax:error - 出现错误时触发

您需要做的就是编写一个函数（将其包装在 $document.ready 中），然后将一些匿名函数绑定到这些事件中的每一个，或者只是您感兴趣的事件。

例如，假设您有一个 id 为“response_data”的 div 想要放入响应数据，并且您有一个 id 为“ajax_trigger”的链接。像这样的：

<%= link_to "My Link", some_model_path(@model_instance), 
                       :remote => true, :html => :id => "ajax_trigger" %>
<div id="response_data">
</div>

您需要做的就是提供一个类似下面的函数，以便将来自服务器的响应放入 div：

$(document).ready(
     function()
          $("a#ajax_trigger").bind("ajax:success",
                   function(evt, data, status, xhr)
                        //this assumes the action returns an HTML snippet
                        $("div#response_data").html(data);
           ).bind("ajax:error", function(evt, data, status, xhr)
                    //do something with the error here
                    $("div#errors p").text(data);
           );
);

真的，您使用 javascript 所做的只是在响应从服务器返回时处理它。您实际上不需要做任何特别的事情来启动 XHR 请求，您还可以安全地将此方法存储在 .js 文件中，该文件作为静态资产提供。如果您使用的是 Rails 3.1，那么您应该将它放在与控制器对应的适当命名的 javascript 文件中。在您的控制器中，您需要确保在 responds_with() 方法中指定 :layout => false，这样控制器只会返回它呈现的部分或模板，而不是完整的页面。此设置还适用于返回要由客户端执行的 javascript 以及 JSON 的操作，具体取决于您在请求中指定的数据类型。

我发现这篇博文很有帮助： http://www.alfajango.com/blog/rails-3-remote-links-and-forms/

【讨论】：

老实说，“Rails 方式”太复杂了，我只选择纯 jQuery =)

解释得很好。这是一个救生员。

【参考方案2】：

这里是有用资源的列表：

Rails 3 Remote Links and Forms: A Definitive Guide Rails link_to documentation Unobtrusive JavaScript Helpers in Rails 3

【讨论】：

这个答案的第一个链接就是你所需要的。