1

我想知道我应该如何从与我的 ruby​​ on rails 应用程序关联的 mysql 数据库中检索信息。当用户从选择框中选择产品时,我想使用所选选项的值从数据库中检索产品的描述和价格,然后将其显示在 div 中。使用以下代码:

    <select>
        <option value='1'>milk</option>
        <option value='2'>eggs</option>
        <option value='3'>butter</option>
    </select>
    <div id='product_description'></div>
    <div id='product_price'></div>

例如,当用户选择鸡蛋时,第一个 div 将显示为:“鸡宝宝”,第二个 div 将显示:“$2.00”。

我的选择标签也是从数据库中填充的,如果这很重要的话。

填充选择的代码:

    <select>
        <option>Select Add-on</option>
        <% for product in @products %>
        <option value="<%= product.id %>"><%= product.item %></option>
        <% end %>
    </select>

我也在使用jquery。

我想我基本上想知道我是否应该只使用 ajax 调用,或者是否有一些神奇的方式来完成任务。如果我需要使用 ajax,我可以从 js.coffee 文件中全部完成吗?我不知道如何将选定的选项值传递给另一个文件以从产品表中选择正确的行。

4

1 回答 1

2

您应该使用options_for_select来生成您的选项: http ://apidock.com/rails/ActionView/Helpers/FormOptionsHelper/

<%= options_for_select([["Dollar", "$"], ["Kroner", "DKK"]]) %>
#generates
<option value="$">Dollar</option>
<option value="DKK">Kroner</option>

结合aselect_tag生成选择: http ://api.rubyonrails.org/classes/ActionView/Helpers/FormTagHelper.html#method-i-select_tag

<% options = "<option>Red</option><option>Green</option><option>Blue</option>".html_safe %>
<%= select_tag "colors", options %>
<div id="product_details"></div>
#generates
<select id="colors" multiple="multiple" name="colors[]">
  <option>Red</option>
  <option>Green</option>
  <option>Blue</option>
</select>
<div id="product_details"></div>

在你的情况下:

<% options = options_for_select(@products.map{ |product| [product.item, product.id] }) %>
<%= select_tag('product_search', options) %>

# jQuery
$('#product_search').bind('Click', function(e) {
  var selected_product_id = $(this).val();
  # Then call the Ajax
  $.ajax({url: '/products/details/' + selected_product_id, # URL to contact
          type: 'GET',
          success: function(data) {
                     $('#product_details').empty().append(data);
                   }
        });
});
  • '/products/details/:id'此代码将在:id代表产品 id ( ProductsController#details)的路径上发送请求。

现在您必须编写服务器端代码来处理请求、生成 HTML(或使用 JSON 响应,在客户端处理速度更快但更重)并发送响应。

于 2013-06-07T17:57:48.270 回答