Rails 3 UJS驱动程序事件

根据Simone Carletti 博客文章 ，Rails 3 ajax助手已经改变了很多。 我们应该使用rails 3编写比使用rails 2更多的javascript。

我试图找出如何显示ajax加载gif-而ajax查询正在运行 – 在“rails 3 way”中。 我想出了这种代码，它使用Rails 3 UJS驱动程序发送的javascript事件。 此示例使用原型：

  Please wait... 
 
  "mylink", :remote => true %> 
  Event.observe('mylink', 'ajax:before', function(event) { $('wait').show(); }); Event.observe('mylink', 'ajax:complete', function(event) { $('wait').hide(); });  

这很好用，但我希望有可能在原型和scriptaculous助手的帮助下编写这些ajax事件“触发器”，就像我们使用link_to_function一样：

有没有办法做到这一点，或者我们应该直接在javascript中编写ajax事件“触发器”，无论是原型还是jquery？

最好的祝福，

Philippe Lang

Answer 1

UJS的想法是将javascript代码从视图中移动到单独的js文件中。 你这样做的方式就是打败这个目标。 相反，我相信你应该有一个带有“dom：loaded”或类似处理程序的js文件，它为rails回调和其他事件设置处理程序。

像（使用原型）的东西：

 (function () { $(document).on('dom:loaded', function (event) { $$('a[data-remote=true]').each(function (link) { link.on('ajax:complete', function (request) { // do something }); }); }); }()); 

这样所有javascripts都与视图分离，这是不引人注目的javascript的想法。

Answer 2

在查看rails源代码后，我想出了这个解决方案：

  def javascript_event_tag(name, event, &block) content = "Event.observe('#{name}', '#{event}', function() {" content = content + update_page(&block) content = content + "});" content_tag(:script, javascript_cdata_section(content)) end 

这样可以更容易地对UJS事件做出反应：

 
  Please wait... 
 <%= link_to 'ajax call', 'code_on_controller', :id => "mylink", :remote => true %> <%= javascript_event_tag('mylink', 'ajax:before') do |page| page.show 'wait' end %> <%= javascript_event_tag('mylink', 'ajax:complete') do |page| page.hide 'wait' end %> 

您可以使用rails helpers而不必编写原始原型或jquery代码。