Question

我有一个页面显示上次更新记录的日期：

<span class="updated-at">
    Last Updated: <i><%= I18n.l @record.updated_at.to_date, :format => :long  %></i>
</span>

可以在页面上更新记录，而不必重新加载页面。如何在不重新加载整个页面的情况下更新此显示值？

Answer 1

此代码每5秒更新一次更新的代码。在不同的时间间隔内更改5000或选择完全不同的触发器。

HTML

<span class="updated-at" data-record-id="<%= @record.id %>">
  Last Updated: <i><%= I18n.l @record.updated_at.to_date, :format => :long  %></i>
</span>

JS

$(document).ready(function() {
  setInterval(function(){ setUpdatedAt(); }, 5000);
}

function setUpdatedAt(){
  var $target = $('.updated-at');
  var id = $target.attr('data-record-id');
  $ajax(
    url : '/records/'+id+'/updated_at',
    dataType : 'json',
    type : 'GET',
    success: function(data){
      $target.html(data['response']);
    }

  );

}

记录控制器

def updated_at
  @record = Record.find(params[:id])

  render json: {
    success: true,
    response: "Last Updated: <i>#{I18n.l @record.updated_at.to_date, :format => :long}</i>"
  }
end

Answer 2

FORM ：如果您想使用表单更新某些内容而不重新加载，请在表单中包含remote：true：

<%= form_for(@entity, url: update_path(@entity), remote: true) do |f| %>

或者使用 LINK ，让我们说删除。在链接中还包括remote：true：

<%= link_to 'delete', yourclass, method: :delete, remote: true %>

对于上述任何一种情况，也应该这样做：

在你的更新行动中，让它回应JS：

respond_to do |format|
      format.html
      format.js
end

在＆＃39; app / views / yourClass / yourUpdateActionName.js.erb＆＃39;中写一个JS文件发回给客户。您可以使用id来标识dom对象，也可以使用jquery遍历对象。使用ID的示例：

$('#updatedAt').text('new')

或者如果你正在删除

$('#updatedAt').fadeOut('new')

更新rails值而不刷新页面

2 个答案: