Question

我遇到了一个奇怪的问题我只想在按下按钮时在页面上显示加载图标如果我对form_remote_for的调用包含Ajax选项，则RJS脚本不起作用。

此作品（“加载”被控制器和RJS隐藏）：

查看：

<%=form_remote_for(:job, @job, {:url => {:action=>:create}}) do |f| %>
[...]
<div id="loading">Loading...</div>

控制器：

def create  
  render :action => "create.js.rjs"   
end

RJS：

page.hide 'loading'

这不起作用（只是添加:loading=>并且加载由视图显示，但未被控制器隐藏回来之前）：

<%=form_remote_for(:job, @job, {:url => {:action=>:create}}, {:loading=>"$('loading').show()"}) do |f| %>
[...]
<div id="loading" style="display:none;">Loading...</div>

因此，如果我对form_remote_for的调用包含Ajax选项，则RJS脚本不起作用。为什么呢？

Answer 1

将表单更改为：

<% form_remote_for (:job, @job, :url => {:action => :create}, :loading =>"$('loading').show()") do |f| %>
# ...
<% end %>

确保创建：

  # POST /jobs
  # POST /jobs.xml
  def create
    render :action => "create.js.rjs"
  end

确保你的create.js.rjs是：

page.hide 'loading'

此方案适合我。正如你所拥有的那样，它正在模板中返回erb，因为它发布到“new” - 基于我做的快速脚手架实现。现在我可能仍然会遗漏一些东西，因为正如我在大规模编辑之前所说的那样，我是新手，但这应该让你前进。

编辑：删除“这是你的代码吗？”交。

Answer 2

虽然没有直接回答你的“为什么”它不起作用的问题，你是否看过使用:loaded参数来隐藏加载DIV而不是依赖rjs文件？

Answer 3

假设您使用原型，您应该使用Ajax.Responders来进行显示/隐藏：

Ajax.Responders.register({
  onCreate: function() {
    Ajax.activeRequestCount++;
        if($('loading') && Ajax.activeRequestCount>0) {
      Effect.Appear('loading',{duration:0.4,queue:'end'});
        };          
  },
  onComplete: function() {
    Ajax.activeRequestCount--;
        if($('loading') && Ajax.activeRequestCount==0) {
        Effect.Fade('loading',{duration:0.4,queue:'end'});
        };    
  }
});

您可以将其粘贴在public / javascripts / application.js

中

不显眼的javascript - 适用于任何隐藏加载div和ajax事件的页面。

当我在form_remote_for中设置选项时，为什么我的RJS会停止工作？

3 个答案: