在下拉列表中选择值后,Div不会更新

问题是当我点击一个城市时,不会显示图表,如果我更改选择,也不会更新图表,而且我似乎无法解决问题。

我的代码如下:

控制器/城市统计控制器。rb:

def city_stats
  @state = params[:state]
  @cities = City.where(:state => @state).select(:id, :display_name).uniq.order('display_name ASC')
  # @city_id = City.select('id').where(:state => params[:city_state]).where(:name => params[:city_name])
  @city_id = City.select('id').find_by_id(params[:city])

  dynamic_query = ActiveRecord::Base.send(:sanitize_sql_array, ['SELECT COALESCE(name) as name, count(*) FROM (SELECT name, regs.segment_id, count(*) FROM regs
    INNER JOIN segments ON regs.segment_id = segments.id
    WHERE regs.city_id = ?
    GROUP BY segment_id, name
    ORDER BY count(*) DESC) as tabe
    GROUP BY name;', @city_id])

  @spatial_ratio = ActiveRecord::Base.connection.select_all(dynamic_query)

  puts @city_id.inspect #I can see the value printed in the terminal
  puts @spatial_ratio.inspect #Same here, even after changing the selection

  respond_to do |format|
    format.json { render :json => @cities }
    format.js {
      render json: {
        html: render_to_string(
          partial: 'city_stats',
          locals: {
            city_id: @city_id,
            spatial_ratio: @spatial_ratio
          })
      }
    }
    format.html
  end
end

<div class="row">
    <label>State <span>:</span></label>
    <%= collection_select :city, :state, City.select(:state).uniq.order('state ASC'), :state, :state, {:prompt => 'Select a State'}, {id: 'city_state', multiple: false} %> 
    <label>City <span>:</span></label>
    <%= collection_select :city, :name, [], :name, :name, {:prompt => 'Select a City'}, {id: 'city_name', multiple: false} %>
</div>
<div id="cities">
 <!-- Here I render the cities list upon selecting a state-->
 <%= render :partial => 'city_stats', :object => @cities %>
</div>

<div id="stats">
</div>

<script type="text/javascript">

$(document).ready(function() {
 $("#city_state").on('change', function(){
  $.ajax({
   url: "/admin/city_stats",
   type: "GET",
   data: {state: $(this).val()},
   success: function(data) {
    $("#city_name").children().remove();
    // Create options and append to the list
    var listitems = []; 
    $.each(data,function(key, value) { 
      listitems += '<option value="' + value.id + '">' + value.display_name + '</option>';    
    });  
    $("#city_name").append(listitems);

    //console.log(listitems);

    $("#city_name").on('click', function(){
    $.ajax({
      url: "/admin/city_stats",
      type: "GET",
      data: {city: $(this).val()},
      success: function(data) {
        var content = $("#city_name").val()
        console.log(content);
        $('#stats').replaceWith("<%= j render(partial: 'city_stats') %>");
        return content;

      }
    })

  })
  }
})

});
});

在部分中:views/city\u stats/\u city\u stats。html。erb:

<%= pie_chart @spatial_ratio.rows %>

N、 B:如果我手动用随机id替换控制器中动态查询中的城市id,当我刷新页面时会显示对应城市的图表,但我不知道为什么它不能动态工作