Question

我正在尝试根据来自collection_select下拉列表的选择，从数据库中显示团队的最近得分。我知道我需要在下拉列表中监听更改事件，但我不知道如何执行AJAX请求或如何在视图中显示数据。

Answer 1

你需要建立一个单独的控制器并在触发更改事件时发送ajax请求，控制器发回一个js响应，你必须在你的客户端处理javascript ...以下链接应该给你一个例子http://blog.bernatfarrero.com/jquery-and-rails-3-mini-tutorial/

Answer 2

好的，我将用category和subcategory模型编写一个示例。

第一个是模型之间的关系：

class Category
 has_many :subcategories
 has_many :objects
end

class Subcategory
 belongs_to :category
 has_many :objects
end

class Object
 belongs_to :category
 belongs_to :subcategory
end

现在是视图中的表单，例如simple_form gem（您可以使用form_for执行此操作）：

<%= simple_form_for(@object, :html => {:multipart => true }) do |f| %>
 <%= f.input :category, :collection => Category.all :prompt => "Select Category" %>
 <%= f.input :subcategory, :label_html => { :class => 'subcategory_label_class' } do %>
 <%= f.grouped_collection_select :subcategory_id, Category.order_by(:title), :subcategories, :title, :id, :name, include_blank: true %>
 <% end %>
 <%= f.button :submit %>
<% end %>

有了这个，我们将子类别与其父类别分组。

下一步，您必须将代码添加到您的objects.js.coffee

$('#object_subcategory_id').parent().hide()
  subcategories = $('#object_subcategory_id').html()
  $('#object_category').change ->
    category = $('#object_category :selected').text()
    escaped_category = category.replace(/([ #;&,.+*~\':"!^$[\]()=>|\/@])/g, '\\$1')
    options = $(subcategories).filter("optgroup[label='#{escaped_category}']").html()
    if options
      $('#object_subcategory_id').html(options)
      $('.subcategory_label_class').show()
      $('#object_subcategory_id').parent().show()
    else
      $('#object_subcategory_id').empty()
      $('.subcategory_label_class').hide()
      $('#object_subcategory_id').parent().hide()

您可以根据自己的需要调整此示例。

我希望它有所帮助。

问候！

使用Rails，Ajax和Jquery基于下拉列表更改内容

2 个答案: