二级联动

场景：一篇文章需要多个标签，其中第一个标签是国家，第二个标签是省，当选择第一个标签的时候，第二个标签的内容相应得到改变。

注意：在使用下面这段代码的过程中，rails5.0的环境中使用turbolinks，下面的js代码是无效的，因此在项目中需要去除turblinks5,方式是在gemfile文件和application.js文件中去掉相应的turblinks5。

#建立三个model
rails g scaffold tag_one name:string
rails g scaffold tag_two name:string
rails g scaffold article content:string tag_one:references tag_two:references

#在articles/_form.html.erb，使用collection_select和grouped_collection_select

  <%= f.label :tag_one_id %>
  <%= f.collection_select(:tag_one_id, TagOne.all, :id, :name)%>



  <%= f.label :tag_two_id %>
  <%= f.grouped_collection_select(:tag_two_id, TagOne.all, :tag_twos, :name, :id, :name) %>


#使用article.js.coffee
jQuery ->
  $('#article_tag_two_id').parent().hide()
  tag_twos = $('#article_tag_two_id').html()
  console.log(tag_twos)
  $('#article_tag_one_id').change ->
    tag_one = $('#article_tag_one_id :selected').text()
    console.log(tag_one)
    options = $(tag_twos).filter("optgroup[label=#{tag_one}]").html()
    console.log(options)
    if options
      $('#article_tag_two_id').html(options)
      $('#article_tag_two_id').parent().show()
    else
      $('#article_tag_two_id').empty()
      $('#article_tag_two_id').parent().hide()