Rails ajax成功事件未启动



我正在努力激发任何Rails ajax事件。我已经尝试过直接从Rails指南中将其简化为最简单的例子,但没有成功。

我有一页表格:

<h1 id="title_line">Zone</h1>
<%= form_for(@zone, remote: true) do |f| %>
<div id="test_text">Test text</div>
<%= f.hidden_field :operation, value: 'warmer' %>
<%= f.submit 'Warmer' %>
<% end %>

生成的表单代码是

<form accept-charset="UTF-8" action="/zones/2" class="edit_zone" data-remote="true" id="edit_zone_2" method="post">
<div style="margin:0;padding:0;display:inline">
<input name="utf8" type="hidden" value="&#x2713;" />
<input name="_method" type="hidden" value="patch" />
</div>
<input id="zone_operation" name="zone[operation]" type="hidden" value="warmer" />
<input name="commit" type="submit" value="Warmer" />
</form>

在js.coffee区域,我有

$(document).ready ->
$(".edit_zone").on("ajax:success", (e, data, status, xhr) ->
$("#test_text").append("Ajax success!")
).bind "ajax:error", (e, xhr, status, error) ->
$("#test_text").append("Ajax failure!")

导致生成javascript

(function() {
$(document).ready(function() {
return $(".edit_zone").on("ajax:success", function(e, data, status, xhr) {
return $("#test_text").append("Ajax success!");
}).bind("ajax:error", function(e, xhr, status, error) {
return $("#test_text").append("Ajax failure!");
});
});
}).call(this);

控制器更新方法包含(减去不相关的东西)

def update
@zone = Zone.find(params[:id])
logger.debug "* update running"
respond_to do |format|
format.html { redirect_to zone_path(@zone), :notice => 'zone was successfully updated.' }
format.json { head :ok }
format.js { render :show}
end
end

show.js.erb只是

$("#title_line").append(" (a test)")

当我点击表单提交按钮时,a test被附加到Zone,但#test_text分区没有附加任何内容。rails日志显示

Started PATCH "/zones/2" for 75.67.229.139 at 2013-12-24 11:37:08 -0500 
Processing by ZonesController#update as JS 
Parameters: {"utf8"=>"✓", "zone"=>{"operation"=>"warmer"}, "commit"=>"Warmer", "id"=>"2"} 
User Load (2.1ms)  SELECT `users`.* FROM `users` WHERE `users`.`id` = 1 LIMIT 1 
Zone Load (1.8ms)  SELECT `zones`.* FROM `zones` WHERE `zones`.`id` = 2 LIMIT 1 
* Make zone warmer 
Zone Load (1.9ms)  SELECT `zones`.* FROM `zones` WHERE `zones`.`id` = 2 LIMIT 1 
Rendered zones/show.js.erb (0.9ms) 
Completed 200 OK in 489ms (Views: 33.7ms | ActiveRecord: 7.8ms) 

因此show方法正在运行(如* update running日志条目所示),成功地呈现了show.js.erb并返回了200 OK。但是ajax事件不会向#test_text追加任何文本。如果我将show.js.erb附加到#test_text,它会起作用,所以我知道ID是正确的。

事实上,我正试图做一些比这更复杂的事情,但如果我不能让这个简单的例子发挥作用,我就没有希望了。我运行的是ruby 2.0.0p247、rails 4.0.0和Safari 7。如果有任何帮助,我将不胜感激。

此问题可能是由缺少data {type: 'script'}:引起的

= form_for(@zone, remote: true, data: {type: 'script'})

这将data-type="script"属性添加到表单中,uJS将其作为参数dataType传递给jQuery的ajax方法。

根据jQuery的ajax方法文档:

  • 如果未指定dataType如果智能推断
  • 如果推断出json,则将响应解析为Js对象,并在出错时返回parse error

不出所料,我做了一件很愚蠢的事。我需要一些页面来请求定期的ajax更新,所以使用了我在某个地方找到的一些代码,将代码放在app/assets/javascripts/common/ajax.js.coffee中。显然,它覆盖了UJS ajax.js,这就是ajax事件处理代码所在的位置。删除该文件解决了问题。但是现在周期性的ajax不能很好地工作。哦,好吧。经验教训。

最新更新