Rails 3 中的 Ajax 回调带有 Prototype，而不是 jQuery-解网

问：

我正在将一个应用程序从 Rails 2 升级到 3，并正在重新设计所有远程函数以使用 Unobtrusive Javascript。我苦苦挣扎的地方是在 UJS 中处理 ajax 回调。

我发现有很多资源展示了如何使用jQuery实现这些回调，但对于原型来说并不多。也许你可以帮我解决这个问题。

在 Rails 2 中，我有这个：

<% remote_form_for @foo, {:loading => "loading_function()", :complete => "complete_function()" } do |f| %>
 ...
<% end %>

在 Rails 3 中，我有这个：

<%= form_for @foo, :remote => true do |f| %>
 ....
<% end %>

从我到目前为止所发现的情况（可能是错误的），我需要将我的旧加载/完成函数附加到表单中，以便它们将被 Rails.js 中的 handleRemote 函数触发。我只是不确定该怎么做。

同样，我在 Prototype 中执行此操作。因此，针对该框架的答案是值得赞赏的。

ruby-on-rails-3 prototypejs 不显眼的javascript

views/tasks/_newform.html.erb:
<%= form_for(@task, :remote => true) do |f| %>
  <div>
    <%= f.label 'Add a new task: ' %>
    <%= f.text_field :name %>
  </div>
  <div>
    <%= f.submit %>
  </div>
<% end %>

views/tasks/index.html.erb:
<div id='newform'>
  <%= render :partial => "newform", :locals => { :@task => Task.new } %>
</div>

views/tasks/create.js.rjs:
page.insert_html :after, 'tablehead', :partial => @task
page.replace_html 'newform',:partial => "newform", :locals => { :@task => Task.new }

编辑：您需要将“format.js”添加到任务控制器的创建方法中

5赞 Hopwise 3/24/2011 #2

答案如下：

<%= form_for @foo, :remote => true do |f| %>
 ...
<% end %>
...
<script type='text/javascript'>
  $('edit_foo').observe('ajax:before', loading_function());
  $('edit_foo').observe('ajax:complete complete_function());
</script>

0赞 Eric Hu 9/13/2011 #3

对于有类似问题的人，在 Rails 2.3.x 源代码中查看远程助手的源代码也可能有所帮助。

就我而言，我想弄清楚如何处理“：update”参数，如下所示：

remote_form_for(@obj, :update => "new_obj", :before => "some js code") do |f|

我必须在remote_function代码中找到更新功能。

对于我的具体问题，看起来不可能获得与 Rails 3 UJS 助手相当的东西。Rails 3 中的函数用来包装请求，而 Rails 2 中的函数用 .对于希望从 Rails 2 中替换该功能的人，我看到了 2 个选项：:updaterails.js:remote => trueAjax.Request(...):updateAjax.Updater(...):update

切换到 jquery-rails，以便您可以访问来自 Ajax 请求的响应，代码如下：

$("#elem").bind("ajax:complete", function(et, e){
  $("#results").html(e.responseText);
});

编写自己的基于原型的代码来获取表单并通过 ajax 提交，使用而不是 .不要使用，因为这将尝试使用。Ajax.Updater(...)Ajax.Request:remote => trueAjax.Request

旁注：我尝试了事件中提供的回调对象ajax:complete

$('new_obj').observe('ajax:complete', function(request){
  console.info(request);
});

该对象似乎不包含任何位置的响应。不过，它非常庞大，所以我可能是错的。不过，希望这能帮助其他试图从 Rails 2 升级到 Rails 3 的人。request

0赞 marklazz 12/29/2011 #4

如果您使用带有：update 选项的 remote_form_for，则有一种方法可以从 Ajax.Request 调用获取响应。因此，您可能不需要更改它即可使用 Ajax.Updater 作为解决方法。基本上，您使用 respone.memo.responseText，在您的示例中，它将是这样的：

$('new_obj').observe('ajax:complete', function(response){
  console.info(response.memo.responseText);
  // Probably you would use it like this:
  $('new_obj').update(response.memo.responseText);
});

上一个：使用 Ajax 请求在 PHP 中提交表单值

下一个：从原型 dom 加载事件内部创建全局对象

Rails 3 中的 Ajax 回调带有 Prototype，而不是 jQuery

Ajax Callbacks in Rails 3 with Prototype, not jQuery

评论