如何为每个 Table 循环迭代添加列(而不是行)?

How to Add Column (Instead of Row) for Each Table Loop Iteration?

而不是像这样将每个 table 创建为一个新行:

TABLE#1

TABLE#2

TABLE#3

怎样才能做到这样:

TABLE #1 | TABLE #2 | TABLE#3

我具体询问的是 月平均 table。

如有任何帮助,我们将不胜感激!

class Quantified < ActiveRecord::Base
    belongs_to :user
    scope :averaged,  -> { where(categories: 'Monthly Average') }
scope :instance,  -> { where(categories: 'One-Time Instance') }

    CATEGORIES = ['Monthly Average', 'One-Time Instance']

end

控制器

  def index
   @averaged_quantifieds = current_user.quantifieds.averaged
   @instance_quantifieds = current_user.quantifieds.instance
  end

索引

<!-- Default bootstrap panel contents -->

<div id="values" class="panel panel-default">

  <div class="panel-heading"><h4><b>AVERAGE</b></h4></div>

  <!-- Table -->
<table>
  <thead>
    <% @averaged_quantifieds.each do |averaged| %>
      <% if averaged.user == current_user %>
        <tr>
  <td>
            <th class="value">
            <%= averaged.name %>
            (<%= averaged.metric %>)
            </th>
        </tr>
  </thead>
  <tbody>
      <tr>
        <th class="category">
        <%= averaged.date.strftime("%m-%d-%Y") %>
        </th>

        <th class="value">
        <%= averaged.result %>
        </th>
      </tr>
  </tbody>
</td>
    <% end %>
    <% end %>
 </table>
</div>

形式

<%= form_for(@quantified) do |f| %>
  <% if @quantified.errors.any? %>
    <div id="error_explanation">
      <h2><%= pluralize(@quantified.errors.count, "error") %> prohibited this quantified from being saved:</h2>

      <ul>
      <% @quantified.errors.full_messages.each do |message| %>
        <li><%= message %></li>
      <% end %>
      </ul>
    </div>
  <% end %>

<div class="america">
<form>
   <%= f.select :categories, Quantified::CATEGORIES %>

   <br>
   <br>

  <div class="form-group">
    <%= f.text_field :name, class: 'form-control', placeholder: 'Enter Name' %>
  </div>

  <div class="form-group">
    <%= f.text_field :result, class: 'form-control', placeholder: 'Enter Result' %>
  </div>

  <div class="form-group">
    <%= f.text_field :metric, class: 'form-control', placeholder: 'Enter Metric' %>
  </div>

    <div class="date-group">
      <label> Date: </label>
      <%= f.date_select :date, :order => [:month, :day, :year], class: 'date-select' %>
    </div>


<div class="america2">
  <%= button_tag(type: 'submit', class: "btn") do %>
  <span class="glyphicon glyphicon-plus"></span>
  <% end %>

  <%= link_to quantifieds_path, class: 'btn' do %>
  <span class="glyphicon glyphicon-chevron-left"></span>
  <% end %>

  <%= link_to @quantified, method: :delete, data: { confirm: 'Are you sure?' }, class: 'btn' do %>
  <span class="glyphicon glyphicon-trash"></span>
  <% end %>
</div>

</form>
</div>
<% end %>

架构

  create_table "quantifieds", force: true do |t|
    t.string   "categories"
    t.string   "name"
    t.string   "metric"
    t.decimal  "result"
    t.date     "date"
    t.datetime "created_at", null: false
    t.datetime "updated_at", null: false
    t.integer  "user_id"
  end

  add_index "quantifieds", ["categories"], name: "index_quantifieds_on_categories"
  add_index "quantifieds", ["user_id"], name: "index_quantifieds_on_user_id"

我自己比较缺乏经验,但我理解你的问题。如果您希望 table 以水平方式布置,则必须更改视图中的代码。例如在你的情况下我认为它应该是这样的:

 <tr>
  <td class="value">
            <%= averaged.name %>
            (<%= averaged.metric %>) </td>
         </tr>

以此类推。

您也没有正确关闭 td。在您的情况下,整个过程只有一个。每次添加数据时都需要一个。

如果我错了,不要钉我十字架,这是我要回答的第一个问题

更多信息在这里:http://www.w3schools.com/html/html_tables.asp

如果我解决了你的问题请回复

假设: - 您在以水平行表示数据时遇到问题。 - 您的 table 中有 4 列并将它们命名为名称、指标、日期、结果。

以下 table 将帮助您解决问题:

<table>
  <thead>
    <tr>
      <th> Name</th>
      <th>Metric</th>
      <th>date</th>
      <th>result</th>
    </tr>
  </thead>

  <tbody>
    <% @averaged_quantifieds.each do |averaged| %>
      <% if averaged.user == current_user %>
        <tr>
          <td><%= averaged.name %> </td>
          <td><%= averaged.metric %> </td>
          <td> <%= average.date %> </td>
          <td><%= averaged.result %> </td>
          </tr>
      <% end %>
    <% end %>
  </tbody>
</table>