Question

我有一个rails app，我用它作为移动应用程序的API。该应用有一个驱动程序模型，其中状态和位置（ lat ， lon ）属性可以从中切换移动应用程序。我有一个驱动程序模型的索引视图（ index.html.erb ），可以由管理员（从浏览器）查看，它显示一个包含驱动程序名称，状态和其他的表属性。我希望此HTML页面上的状态和位置能够自动更新（无需刷新页面），如果在管理员查看时从移动应用程序更改了这些状态和位置。

我知道这可以使用javascript或jQuery来完成，并且它将涉及定期从服务器加载数据，比较显示的当前值，然后更新不匹配的值。但是我没有JS或jQuery的任何经验，我找不到任何好的教程，解释如何逐步将rails与这些功能集成。

这是控制器：

应用程序/控制器/ drivers_controller.rb

class DriversController < ApplicationController

  # GET /drivers
  # GET /drivers.json
  def index
    @drivers = Driver.all.order(:id)

    respond_to do |format|
       format.html 
       format.json { render :json => @drivers.to_json(only: [:id, :name, :contact, :lat, :lon, :status]), status: 200 }
    end
  end

end

控制器还具有与API相关的其他功能并操纵数据库。

应用程序/视图/驱动器/ index.html.erb

<table class="table">
  <thead>
    <tr>
      <th>ID</th>
      <th>Name</th>
      <th>Contact</th>
      <th>Status</th>
      <th><i class="glyphicon glyphicon-map-marker"></i> Location</th>
      <th colspan="3"></th>
    </tr>
  </thead>

  <tbody>
    <% @drivers.each do |driver| %>
      <tr>
        <td><%= driver.id %></td>
        <td><%= driver.name %></td>
        <td><%= driver.contact %></td>
        <td>
          <% if driver.status == 0 %>
            Uninitialised Account
          <% elsif driver.status == 1 %>
            Available For Hire
          <% elsif driver.status == 2 %>
            Hired
          <% elsif driver.status == 3 %>
            Off Duty
          <% elsif driver.status == 4 %>
            Unknown  
          <% end %>
        </td>
        <td>(<%= driver.lat %>,  <%= driver.lon %>)/td>
        <td><%= link_to 'Show', driver_path(driver), class: 'btn btn-primary btn-xs' %></td>
        <td><%= link_to 'Edit', edit_driver_path(driver), class: 'btn btn-info btn-xs' %></td>
        <td><%= link_to 'Destroy', driver, class: 'btn btn-danger btn-xs', method: :delete, data: { confirm: 'Are you sure you want to delete this driver\'s record?' } %></td>
      </tr>
    <% end %>
  </tbody>
</table>

<br>

<%= link_to new_driver_path, class: 'btn btn-success' do %>
  <i class="glyphicon glyphicon-plus"></i> New Driver
<% end %>

我也在我的应用程序中集成了bootstrap。

Answer 1

您需要套接字来实现此逻辑。

Pusher是一个很好的宝石。实现它真的很容易。您可以在此处详细了解相关信息 - https://pusher.com/

示例：

将数据从控制器推送到视图：

Pusher.trigger('my-channel', 'my-event', { message: 'hello world' });

在您的视图中，您应该等待来自服务器的推送事件：

var channel = pusher.subscribe('my-channel'); channel.bind('my-event', function(data) { alert('Received my-event with message: ' + data.message); });

如何在不刷新页面的情况下自动更新Rails应用程序视图中的表数据？

1 个答案: