Javascript 在Rails 3应用程序中使用jQuery刷新div元素
我有一个rails 3应用程序,它使用resque在后台运行长时间运行的作业,我想在另一个页面上创建一个结果视图 目前,我有这个方案的工作 Resque运行作业,并在作业进行时将信息写入数据库(更新信息条目)。作业完成后,它将更新其中一个数据库条目,即设置complete=1(创建complete时的值为0) 数据库模式是Javascript 在Rails 3应用程序中使用jQuery刷新div元素,javascript,jquery,ruby-on-rails-3,Javascript,Jquery,Ruby On Rails 3,我有一个rails 3应用程序,它使用resque在后台运行长时间运行的作业,我想在另一个页面上创建一个结果视图 目前,我有这个方案的工作 Resque运行作业,并在作业进行时将信息写入数据库(更新信息条目)。作业完成后,它将更新其中一个数据库条目,即设置complete=1(创建complete时的值为0) 数据库模式是 create_table "refreshes", :force => true do |t| t.string "name" t.string
create_table "refreshes", :force => true do |t|
t.string "name"
t.string "info"
t.integer "complete"
t.datetime "created_at"
t.datetime "updated_at"
end
应用程序中的另一个页面视图将通过调用其控制器并在页面上显示最新数据来显示数据库条目。如果数据库中的完整值不等于1,此视图具有插入标准JavaScript刷新元素的逻辑
view.html.erb
<% if @refreshes.complete == 0 %>
<meta http-equiv='refresh' content='5'>
<%end%>
<div id="data">
<p>
<b>Name:</b>
<%= @refreshes.name %>
</p>
<p>
<b>Info:</b>
<%= @refreshes.info %>
</p>
</div>
这一切都很好,但当complete设置为0时,它确实会每5秒重新加载一次完整的页面,我想做的只是刷新显示数据的div(div id=data),而不刷新整个页面
我认为这可以通过jquery和一些JavaScript来实现,但我找不到一种方法来实现,所以有人能帮忙吗?或者,即使你能给我指个方向,我也会很感激的
干杯
Mike使用Jquery,您可以执行ajax调用,可以使用计时器反复调用 application.js 单击按钮或后台作业启动时调用此函数
updateDiv = function(){
$.ajax{
url:'/controller/view.js?paramid='+id+'so..on='+so..on,
method:get,
success:function(){
if (data.complete==1){
//stop this
}else{
setInterval(updateDiv,5000);
}
}
在控制器内:::
def view
//logic to find param
render do|f|
f.html
f.js
end
end
view.js.erb
#create a partial that can be rendered inside div 'data'
$('#data').render(<% partial %>);
or
$('#data').html();
#创建可在div“data”中呈现的分部
$(“#数据”).render();
或
$('#data').html();
是的,这可以使用JavaScript完成。一种方法是
$(document).ready(function() {
// get data every 5 mins and refresh myDiv
var pingAfter = 5000;
var refreshId = setInterval(function() {
$("#myDiv").load('/partial/data');
}, pingAfter);
});
网站上有一个实现相同的示例代码 谢谢两位,我会在周末尝试这两款
$(document).ready(function() {
// get data every 5 mins and refresh myDiv
var pingAfter = 5000;
var refreshId = setInterval(function() {
$("#myDiv").load('/partial/data');
}, pingAfter);
});