- 一:partial模版替换
- $(document).on('change','.change_city',function(){
- var $this = $(this),
- district_name = $this.find('.text').text();
- if (district_name != "") {
- $.ajax({
- url: "/inquiry/inquiries/change_city",
- type: "get",
- data: {
- district_name: district_name
- },
- success: function(data){
- $this.parents('.fields').find('.city').html(data);
- $(document).find('.ui.dropdown').dropdown();
- }
- });
- }
- });
- 获取地址
- def change_city
- @cities = City.ind_cities(params[:district_name])||[]
- render :partial => "change_city"
- end
- <%= select_tag "contact[inquiries][city]", options_for_select(@cities), include_blank: "City", class: "ui compact dropdown" %>
- 二:选择内容替换
- <%= f.select :province, options_for_select(City.ind_districts, company.province), include_blank: 'Select State' %>
- <%= f.select :city, options_for_select({company.city => company.city}.compact || [], company.city), include_blank: 'Select City' %>
- $("#state").change(function(){
- $.ajax({
- type: "get",
- url: '<%= get_cities_path %>',
- dataType: "json",
- data: {state: $('#state').val()},
- success: function(data){
- $("#city").html('<option value="">City </option>');
- $("#city").append(data.options);
- var select_comboSelect = $(document).find('select');
- if (select_comboSelect.length && select_comboSelect.length > 0) {
- select_comboSelect.comboSelect();
- }
- }
- });
- });
- def city
- options = City.ind_cities(params[:q].to_s.strip).inject(""){|options_str, c| options_str += "<option value='#{c[0]}'>#{c[1]}</option>"}
- render json: {options: options}
- end
Rials实现下拉框联动的两种实现方式
最新推荐文章于 2020-09-10 19:16:19 发布