Question

是否可以（如何）根据select标签更改表格？

index.html.erb中的代码

<p><%= select_tag "Stocks", options_from_collection_for_select(@stocks, "id", "ticker") %></p>
    <table class="table">
      <thead>
        <tr>
          <th>Date</th>
          <th>Market Price</th>           
        </tr>
      </thead>
      <tbody>
        <% @stock.market_prices.order(:closing_date).reverse.each do |mp|%>
        <tr> 
          <td><%=mp.closing_date %></td>
          <td><%=number_with_precision(mp.closing_price, precision: 2) %></td>
        <%end%>
      </tbody>
    </table>

我想从选择器中选择一个股票，它会分别改变表格。

EDITED

控制器

def index
@stocks = Stock.all.order(:ticker_number)
@stock = @stocks.first
end

def get_stock_market_price
  @stock = Stock.where(id: params[:stock_id]).first
end

index.html.erb

<script type="text/javascript">
  $(document).ready(function() {
    $('#stock').change(function() {
      var url_path;
      url_path = "/get_stock_market_price"; // Please replace this url with your original action path.
      return $.ajax({
        url: url_path,
        data: "stock_id=" + this.value,
        success: function(result) {}
      });
    });
  });
</script> 

  <p>
    <%= select_tag "Stocks", options_from_collection_for_select(@stocks, "id", "ticker"), id: 'stock' %>
  </p>

      <div id="marketdata">
        <%= render partial: "market_prices", object: @stock %>
      </div>

_market_prices.html.erb

<table class="table">
  <thead>
    <tr>
      <th>Date</th>
      <th>Market Price</th>           
    </tr>
  </thead>
  <tbody>
    <% @stock.market_prices.order(:closing_date).reverse.each do |mp|%>
    <tr> 
      <td><%=mp.closing_date %></td>
      <td><%=number_with_precision(mp.closing_price, precision: 2) %></td>
    <%end%>
  </tbody>
</table>

get_stock_market_price.js.erb

$("#marketdata").html('#{ escape_javascript(render partial: "market_prices", object: @stock ) }');

的routes.rb

get "/get_stock_market_price" => "market_prices#get_stock_market_price"

Answer 1

<%= select_tag "Stocks", options_from_collection_for_select(@stocks, "id", "ticker"), :onchange => "update_table(this.value)" %>

<强> JAVASCRIPT

function update_table(stock_id) {  
  jQuery.ajax({
    url: "/update_table",
    type: "GET",
    data: {"id" : id},
    dataType: "html",
    success: function(data) {
      jQuery("#tablesDiv").html(data);
    }
  });
}

<强>控制器

def update_table
  @stocks = Stock.where(id => params[:id]).all
  render :partial => "update_table", :object => @stocks
end

<强>视图 _update_table.html.erb

<table class="table">
      <thead>
        <tr>
          <th>Date</th>
          <th>Market Price</th>           
        </tr>
      </thead>
      <tbody>
<% @stock.market_prices.order(:closing_date).reverse.each do |mp|%>
        <tr> 
          <td><%=mp.closing_date %></td>
          <td><%=number_with_precision(mp.closing_price, precision: 2) %></td>
</tr>

    <%end%>
     </tbody>
         </table>

index.htmlerb

    <div id = "tablesDiv"></div>

还在routes.rb中添加/ update_table的路由

Answer 2

您可以执行以下操作。

<强> index.html.erb

<script type="text/javascript">
  $(document).ready(function() {
    $('#stock').change(function() {
      var url_path;
      url_path = "/get_stock_market_price"; // Please replace this url with your original action path.
      return $.ajax({
        url: url_path,
        data: "stock_id=" + this.value,
        success: function(result) {}
      });
    });
  });
</script>

<p>
  <%= select_tag "Stocks", options_from_collection_for_select(@stocks, "id", "ticker"), id: 'stock' %>
</p>

<div id="marketdata">
  # Assuming you have stock object in @stock, if not then change following @stock with @stocks.first
  <%= render partial: "market_prices", object: @stock %>
</div>

<强> _market_prices.html.erb

<table class="table">
  <thead>
    <tr>
      <th>Date</th>
      <th>Market Price</th>           
    </tr>
  </thead>
  <tbody>
    <% @stock.market_prices.order(:closing_date).reverse.each do |mp|%>
    <tr> 
      <td><%=mp.closing_date %></td>
      <td><%=number_with_precision(mp.closing_price, precision: 2) %></td>
    <%end%>
  </tbody>
</table>

<强> stocks_controller.rb

def get_stock_market_price
  @stock = Stock.where(id: params[:stock_id]).first
end

<强> get_stock_market_price.js.erb

$("#marketdata").html('#{ escape_javascript(render partial: "market_prices", object: @stock ) }');

<强>的routes.rb

get "/get_stock_market_price" => "stocks#get_stock_market_price"

如何在Rails中的select标签中生成表格

2 个答案: