Kun*_*nal 10 ajax ruby-on-rails ruby-on-rails-3
感谢阅读这篇文章.过去几天我一直坚持使用RoR的问题.我在index.html.erb下面有一个表单:
<head>
<title>Ajax List Demo</title>
<%= javascript_include_tag :defaults %>
<%= csrf_meta_tag %>
</head>
<body>
<h3>Add to list using Ajax</h3>
<% form_tag :action => :list , :method=>:get, :remote=>true do %>
Enter the public url:<%= text_field_tag 'url' ,'', :size => 80 %>
<%= submit_tag "Find" %>
<% end %>
<div id="my_list">
</div>
</body>
在控制器中我有:
def list
puts "here!!!!"
reader = Reader.new
@profiles = reader.processURL(params[:url]) #profileList =
respond_to do |format|
#format.html { render :partial=>true, :locals => { :profiles => @profiles}}#{ render :partial=>'profiles/list',:layout => false, :locals => { :profiles => @profiles}}
format.js {render :content_type => 'text/javascript', :locals => { :profiles => @profiles}}
# index.html.erb
# format.rss render :partial=>'profiles/list',:layout => false, :locals => { :profiles => @profiles}
end
并将远程UJS的js文件作为list.js.erb
$("#my_list").html("<%= escape_javascript(render(:partial => "list"))%>");
问题是我无法在div标签my_list中获得结果来呈现部分_list.html.erb.我得到一个空白页面,406错误.如果我在控制器中取消注释渲染html代码,我会在浏览器中渲染部分后退.我有点卡住,我想提交表单和结果弹出my_list div.我是新手,所以如果我错过了一些明显的东西,请毫不犹豫地向我指出......我绝对愿意尝试.
将其改为:
<html>
<head>
<title>Ajax List Demo</title>
<h1>Listing posts</h1>
<%= javascript_include_tag 'jquery.js' %>
<%= csrf_meta_tag %>
</head>
<body>
<h3>Add to list using Ajax</h3>
<% form_tag :action => :doit , :method=>:get, :remote=>true do %>
Enter the public url:<%= text_field_tag 'url' ,'', :size => 80 %>
<%= submit_tag "Find" %>
<% end %>
<div id="my_list">
</div>
控制器:
def doit
puts "here!!!!"
reader = Reader.new
@profiles = reader.processURL(params[:url])
respond_to do |format|
# format.html {render :partial=>true, :locals => { :profiles => @profiles}}#{ render :partial=>'profiles/list',:layout => false, :locals => { :profiles => @profiles}}
format.js #{render :content_type => 'text/javascript', :locals => { :profiles => @profiles}}
# index.html.erb
# format.rss render :partial=>'profiles/list',:layout => false, :locals => { :profiles => @profiles}
end
JS _doit.js.erb $("#my_list").html("<%= escape_javascript(render(:partial =>"doit"))%>");
最后是部分:
_doit.html.erb.
但是我仍然得到406错误,我没有重复_doit js或erb.有什么突出的不正确吗？再次感谢!
另一个更新:
我认为表单没有正确呈现:
这呈现:
<% form_tag :action => :doit , :remote=>true, :id => 'myform' do %>
Enter the public url:<%= text_field_tag 'url' ,'', :size => 80 %>
<%= submit_tag "Find" %>
<% end %>
这个:
<form accept-charset="UTF-8" action="/home/doit?id=myform&remote=true" method="post">
<div style="margin:0;padding:0;display:inline">
<input name="utf8" type="hidden" value="✓" />
<input name="authenticity_token" type="hidden" value="MLuau4hvfdGO6FrYCzE0c0JzwHhHKZqjmV49U673sK8=" />
</div> Enter the public url:
<input id="url" name="url" size="80" type="text" value="" />
<input name="commit" type="submit" value="Find" />
<input name="commit" type="submit" value="Find" />
好的,最后得到一个线索形式需要括号:
<%= form_tag( { :action => 'doit' }, :multipart => true, :remote=>true, :id => 'myform' ) do %>
好的最后更新今晚:现在我进入日志:
在10月27日星期三22:40:55 -0400 2010年开始POST"/ home/doit"为127.0.0.1 !!!! 由HomeController处理#doit作为JS参数:{"commit"=>"查找","url"=>"http://www.facebook.com/people/James-Stewart/653161299","authenticity_token"=>" MLuau4hvf dGO6FrYCzE0c0JzwHhHKZqjmV49U673sK8 =","utf8"=>"Γ£ô"}渲染回家/ _doit.html.erb(4.0ms)渲染回家/ doit.js.erb(9.0ms)完成200 OK,807ms(浏览次数:40.0ms) | ActiveRecord:0.0ms)
我看作JS,它说它呈现我的js/partial.但是我在my_list div上什么都没得到.我的JS档案:
$("#my_list").html("<%= escape_javascript(render(:partial => "doit"))%>");
我的html.erb表单文件现在有:
<script$('#myform').bind('ajax:success', function(evt, data, status, xhr){
xhr.responseText;
});></script>
它就像表单什么都不做,这是一个好兆头,没有406错误.我知道这是接近的,如果任何人都可以点什么,我需要在js那将是巨大的,否则我会休息一下,尽量tmrw做.
好吧,我认为它得到的回复只是没有像你指出的那样呈现昨天史蒂夫的问题.
在Firebug上调试JS我看到了我想在div中呈现的html,为此:
http://localhost:3000/javascripts/prototype.js?1285674435/event/seq/1
这意味着我认为我现在正在收到JS回复.
我在表单页面上有这个:
<script>$('#myform').bind('ajax:success', function(evt, data, status, xhr){
$('#my_list').html(eval(xhr.responseText));
});</script>
检查说它不知道myform是什么,但我在Rails代码中输入:id =>'myform'.
再次感谢,我在这里得到了很多帮助,我想分享一下我最终如何让它回到社区.
方法doit(def.需要更好的控制器动作名称)的js文件是doit.js
代码最终是:
$("my_list").update("<%= escape_javascript(render(:partial => "doit"))%>");
出于某种原因,把它当作#my_list不会在Firefox中找到,我不得不使用Firebug终于想出解决办法.
显然这与下面建议的方式不同,我将把js脚本放回到表单中并删除.js.erb文件,看看它是如何工作的.我想我只是在format.js响应中渲染部分？还有谁在哪里找到有关写UJS文件的信息？我对以$开头的任何东西的语法一无所知.
再次感谢您的帮助,最后感觉我在学习rails方面取得了进展.
jan*_*eve 26
我在Hacker News上发布了这个答案,但认为Stack Overflow社区也可能受益:-)
在Rails 3中,javascript驱动程序非常不干涉(即不引人注目).您遇到的问题是您的应用程序返回到浏览器的一串javascript,但页面中没有任何内容在页面上下文中执行该javascript.
rails.js ujs驱动程序绑定到表单和链接data-remote=true,这就是它:remote => true正在做的,使它们远程提交请求,但这就是Rails魔法停止的地方.
好消息是远程请求会触发您可以绑定的某些事件,这些事件可以让您访问服务器返回的数据(按以下顺序触发):
ajax:before
ajax:loading
ajax:success
ajax:complete
ajax:failure
ajax:after
您需要将事件绑定到ajax:success表单事件.因此,如果您的表单的ID为"myform",则您需要在页面上显示以下内容:
$('#myform').bind('ajax:success', function(evt, data, status, xhr){
eval(xhr.responseText);
});
xhr.responseText 是你的服务器返回的,所以这只是作为javascript执行它.
当然,也可以通过一些错误处理来绑定故障事件.
我通常甚至不使用action.js.erb方法返回javascript,我只是让我的控制器渲染HTML部分,然后我在页面中有这样的绑定:
$('#myform').bind('ajax:success', function(evt, data, status, xhr){
$('#target-div').html(xhr.responseText);
});
我实际上正在撰写关于此的完整文章,但希望这足以让你前进.
编辑:我完成了那篇文章,完全解释了Rails 3中的远程链接和表单.也许它会有所帮助:
小智 6
如果查看页面的渲染源,您应该注意到fields属性中的错误.
正确的方法如下:
<%= form_tag({:action => 'list'}, :remote => true %>
注意大括号,非常重要!或者你可以做到:
<%= form_tag('list', :remote => true %>
你有 2 个名为“_list”的部分吗？也许这会引起问题，你应该更具体一点：
$("#my_list").html("<%= escape_javascript(render(:partial => "list.html.erb"))%>");
我不确定这是否有帮助，但是如果您在 IE 中使用，请注意 IE 会发送一些标头，这些标头会影响您的控制器的响应方式。因此，您可能正在使用 IE 发送 Ajax 请求，但您的 Rails 应用程序认为这只是一个普通的 html 请求。
我必须设置 jQuery 以首先删除当前标头，然后仅添加 javascript 标头：
$.ajaxSetup({
'beforeSend': function(xhr) {xhr.setRequestHeader("Accept",'');xhr.setRequestHeader("Accept", "text/javascript")}
})