RAILS AJAX

方法1.用observe_field（观察者，监测select的事件）：
1）在view中：
点击触发的select:
<%= collection_select(:person, :area_id, @areas,:id, :name,
options = {}, {:id => 'person_area'})%>
生成观察者的JS（:update是使用了innerHTML,在IE中select.innerHTML不能正确显示其中的option,，解决方法是返回完整的<select>更新其上级元素的innerHTML）：
<%= observe_field 'person_area', :update=> 'person_area_places', :url =>{:action => :area_places_options},:with=>'id' %>
二级下拉菜单（需动态更新的）：
<%= collection_select(:person, :place_id, @places,:id, :name, { :include_blank => true }, {:id=> 'person_area_places'} ) %>
2）在controller中：
    defarea_places_options
     @places = Place.find_all_by_area_id(params[:id])
     #因为只返回固定的option列，所以干脆连view都省了
     # [Place.new].concat(@places) 是为了能选择空值（对应:include_blank => true）
     render :inline => %{<%=options_from_collection_for_select([Place.new].concat(@places),:id, :name) %>}
   end

方法2.把触发的事件定义直接嵌入到select中：
重点是remote_function的灵活运用
1）在view中：
点击触发的select:
<%= collection_select(:person, :area_id, @areas,:id, :name, options = {}, html_options = {:onChange=> remote_function(:update =>"person_area_places", :url => { :action=> "area_places_options"}, :with =>"'id='+value" )} ) %>

二级下拉菜单（一样）：
<%= collection_select(:person, :place_id, @places,:id, :name, { :include_blank => true }, {:id=> 'person_area_places'} ) %>
2）在controller中,与方法1一样

最终采用方案
1）在view中：
点击触发的select:
<%= collection_select(:person, :area_id, @areas,:id, :name, options = {}, html_options = {:onChange=> remote_function(:update =>"person_area_places_box", :url => { :action=> :area_places_select}, :with =>"'id='+value" )} ) %>

二级下拉菜单（为了兼容IE，用个容器包起来）：
<spanid="person_area_places_box">
<%= render :partial => 'places'%>
</span>

_places.rhtml:
<%= collection_select(:person, :place_id, @places,:id, :name, { :include_blank => true } )%>

2）在controller中：
    defarea_places_select
     @places = Place.find_all_by_area_id(params[:id])
     render :partial => 'places'
   end