使用先前下拉列表的结果填充下拉列表

我有一个包含Schools和Majors的Rails数据库。 一旦用户选择了他的学校,我想填写专业的下拉,只有相应学校的专业。 目前我有两个工作下降,但你可以看到他们只选择所有值。 我是否需要Json / Ajax / JavaScript,如果是这样,我该如何实现呢?



编辑

当前的解决方案是在每个下拉列表选择上使用异步请求。 假设你有一个小的总选择语料库(假设<5k),那么在页面加载时只有1个异步操作可能会更好,然后在用户做出选择时使用JS来填充下拉列表。 这将节省大量网络呼叫,并提供更好的用户体验。

原版的

好吧,经过多次搜索后我得到了一个正在运行的AJAX请求(我将在这里发帖给后人)。

在我的数据库中创建新课程时,学校和主要外键必须是非空的。 这是下拉菜单

  
<%= f.label :school_id %>
<%= f.collection_select :school_id, School.order(:name),:id,:name, {include_blank: false},{:id=>'school_id_select'} %>
<%= f.label :major_id %>
<%= f.collection_select :major_id, [],:id,:name, {include_blank: false},{:id=>'major_id_select'} %>

既然HTML已经启动,我们需要一些JavaScript(和jQuery)来处理AJAX请求

 //app/assests/javascripts/courses.js (note this was generated as a .coffee file, which I changed to .js as I don't know CoffeeScript console.log('loaded courses.js')//check that the file is loaded $(document).on('change','#school_id_select', function () {//change majors when user changes school load_majors_from_school_dropdown(); }); $(document).ready(load_majors_from_school_dropdown);//populate majors when page loads with first school function load_majors_from_school_dropdown(){ var request = "/majors/find_majors_given_school_id?school_id=" //access controller of interest + $('#school_id_select').val(); var aj = $.ajax({ url: request, type: 'get', data: $(this).serialize() }).done(function (data) { change_majors(data);//modify the majors' dropdown }).fail(function (data) { console.log('AJAX request has FAILED'); }); }; //modify the majors' dropdown function change_majors(data) { $("#major_id_select").empty();//remove all previous majors for(i = 0;i").attr("value", data[i].id).text(data[i].name) ); } }; 

记下’request’变量。 这表示将处理请求的控制器和操作。 现在我们必须成功。 我的Major控制器已经存在,所以我们只需要添加动作。 首先添加操作的路由以使Rails服务器知道该操作。

 #config/routes.rb Rails.application.routes.draw do #... get 'majors/find_majors_given_school_id' #... end 

现在在Major控制器中创建操作

 #app/controllers/majors_controller.rb #custom action for AJAX/JSON calls. Note this can be done multiple ways def find_majors_given_school_id school_id = params[:school_id]#utilizes the url to extract school_id ".../find_majors_given_school_id?school_id=123123" puts "THIS IS MY SCHOOL ID :: #{school_id}"#view this in teminal majors = Major.search_for_school_id(school_id).as_json#query the model for the data and convert it to a hash using as_json puts "THESE ARE MY MAJORS IN A HASH :: #{majors}" respond_to do |format| format.json { render json: majors } end end 

最后,我们必须创建查询以在我们的模型中提取此信息。

 #app/models/major.rb class Major < ActiveRecord::Base has_many :courses, dependent: :destroy belongs_to :school, :foreign_key => "school_id" def self.search_for_school_id(id) where("school_id = ?",id) end #... end 

我认为这就是一切。 肯定有其他方法可以实现这一点,但这个方法对我有用。 祝好运!