rails使用ajax实现无刷新二级级联菜单

　　今儿个老师让用rails实现二级菜单动态无刷新，而且要默认显示原目录选项，这下愁坏啦！还好网上牛人很多，用jquery实现了无刷新二级级联菜单，试了一下，成功！在分享一下下~~

　　环境：winxp，ruby1.8.7-p352，rails 2.3.14

　　数据库中：目录表categories，字段 id parentid name，parentid 为0是父级。

　　　　　　　新闻表news，字段 id title content category_id，category_id为目录id（表间已关联）

　　基本思路：在select中嵌入js函数，当选择项改变时触发事件，使用jquery的aja函数调用news_controller中的方法，获取子菜单，并回传给二级select。

　　首先引入jquery文件

<%= javascript_include_tag 'jquery-1.7.1.js' %>

　　修改controller中edit

  # GET /news/1/edit
  def edit
    @new = News.find(params[:id])
    @parent = Category.find(:all,:conditions=>["parentid = 0"])
    @classes = Category.find(:all,:conditions=>["parentid = ?",@new.category.parentid])
  end

　　view页面中

<%= select_tag "parent",
                     options_for_select(@parent.collect { |p| [p.name, p.id] },{:include_blank=>false, :selected =>@parenid}),
                     :onchange => "get_options(this.value)" %>
      <%= select "new", "category_id", @classes.collect { |t| [t.name, t.id] }, {:include_blank=>false, :selected =>@new.category_id} %>

　　添加js的get_options方法

<script type="text/javascript">
          function get_options(value) {
              $.ajax({
                          type: "POST",
                          url:'/news/get_child_cate?id=' + value,
                          data:'text',
                          success: function(data) {
                              $("#xinwen_classid").html(data);
                          }
                      }
              )
          }
</script>

　　其中调用了news中的get_child_cate方法，于是在news_controller添加方法

  def get_child_cate
    options = ""
    city = Category.find(:all, :conditions => ["parentid = ?", params[:id]])
    city.each do |s|
      options << "<option value=#{s.id}>#{s.name}</option>"
    end
    render :text => options
  end

OK大功告成~！