用于rails中动态组合框选择的Ajax

时间:2014-06-21 08:51:15

标签: javascript jquery ruby-on-rails ajax

我在单页中有两个组合框。现在我想要如果我选择第一个组合框选项然后在第二个组合框中它会自动显示与第一个选定选项相关的选项而不刷新页面。

我的模特:

class Location < ActiveRecord::Base
  scope :active, -> { where(:is_active => true) }
  has_many :stores
end

class Store < ActiveRecord::Base
  scope :active, -> { where(:is_active => true) }
  belongs_to :location
  has_many :companies
end

class Company < ActiveRecord::Base
  belongs_to :store
  scope :active, -> { where(:is_active => true) }
end

在我的 HAML查看表单

  .field
    .ui-widget
      = f.label :location
      = select_tag(:location, options_from_collection_for_select(Location.active, :id, :name), :prompt => "Select location")

  .field
    .ui-widget
      = f.label :store
      = f.select :store_id, Store.active.collect { |s| [s.name, s.id] }, :prompt => "Select store"

我知道使用Ajax是可能的,我也搜索了很多ajax,但它是用于php而我无法理解如何使用。我以前从未使用过Ajax。请帮帮我..先谢谢。 :)

1 个答案:

答案 0 :(得分:0)

首先要了解AJAX与php或rails无关的一件事,它是一个javascript函数调用

现在根据您的问题在我的 HAML查看表单

.field
.ui-widget
  = f.label :location
  = select_tag(:location, options_from_collection_for_select(Location.active, :id, :name), :prompt => "Select location", onchange: "change_store(this)")

.field
.ui-widget#store_list
  = f.label :store
  = f.select :store_id, Store.active.collect { |s| [s.name, s.id] }, :prompt => "Select store"

现在位于 js文件

function change_store(select_tag){
  value1 = $(select_tag).val()
  $.ajax({
    url: "controller_name/mehuod_name",
    data: {data1: value1}
  })
 }

现在将路由放在route.rb文件中并在各自的控制器中创建方法来查找商店列表,然后你可以在&#34; select_lit&#34;下替换html。使用jquery,简单

希望这是你所期待的