Question

我发现这个函数（remote_function）是Prototype帮助器的一部分，它是用Rails 3.1从框架中删除的，以及如何更改ajax？

      country
      %select#country{:name => "country", :onchange => remote_function(:update => 'region_city', :url => { :action => :get_regions_cities_for_country}, :with => 'Form.Element.serialize(this)')}
        = options_for_select( Country.find(:all).map {|u| [u.name,u.id]})
      %div{:id => "region_city"}
        region
        %select#region{:name => "region", :onchange => remote_function(:update => 'city', :url => { :action => :get_cities}, :with => 'Form.Element.serialize(this)')}
          = options_for_select(Country.find(:first).regions.find(:all).map {|u| [u.name,u.id]})
        city
        #{select_tag(:city, options_for_select( Country.find(:first).regions.find(:first).cities.find(:all).map {|u| [u.name,u.id]} ))}

Answer 1

原型不再存在于rails中。请改用jquery-ujs。看到另一个问题寻求灵感：Ruby on Rails - drop down box on change event

Answer 2

的观点：

= select_tag(:district,"<option value='0'>#{t('Please select district')}</option>".html_safe+options_from_collection_for_select(District.all, "id", "title"),:'data-remote' => 'true',:'data-url' => url_for(:controller => 'select', :action => 'getdata'),:'data-type' => 'json')
= select_tag(:state,"<option value='0'>#{t('Please select state')}</option>".html_safe,:'data-remote' => 'true',:'data-url' => url_for(:controller => 'select', :action => 'getdata'),:'data-type' => 'json')
= select_tag(:city,"<option value='0'>#{t('Please select city')}</option>".html_safe)

:javascript

        $(document).ready(function() {
          $('#district').live('ajax:success', function(evt, data, status, xhr) {
            var selectbox2 = $('#state');
            selectbox2.empty();
            var opt = $('<option/>');
            opt.attr('value', "0");
            opt.text("#{t('Please select state')}");
            opt.appendTo(selectbox2);
            $.each(data, function(index, value) {
              var opt = $('<option/>');
              opt.attr('value', value[0]);
              opt.text(value[1]);
              opt.appendTo(selectbox2);
            });
            var selectbox3 = $('#city');
            selectbox3.empty();
            var opt = $('<option/>');
            opt.attr('value', "0");
            opt.text("#{t('Please select city')}");
            opt.appendTo(selectbox3);
          });
          $('#state').live('ajax:success', function(evt, data, status, xhr) {
            var selectbox3 = $('#city');
            selectbox3.empty();
            $.each(data, function(index, value) {
              var opt = $('<option/>');
              opt.attr('value', value[0]);
              opt.text(value[1]);
              opt.appendTo(selectbox3);
            });
          });
        });

控制器：

class SelectController < ApplicationController

  def getdata

    @data_for_select1 = params[:district]
    if @data_for_select1
      @data_for_select2 = State.where(:district_id => @data_for_select1).all
      render :json => @data_for_select2.map{|c| [c.id, c.title]}
    else
      @data_for_select1 = params[:state]
      @data_for_select2 = City.where(:state_id => @data_for_select1).all
      render :json => @data_for_select2.map{|c| [c.id, c.name]}
    end
  end
end

路线：

  get 'assets' => 'select#getdata'

注意：您必须使用本地化的短语，否则js不起作用

错误未定义方法`remote_function'（如何使用remote_function使用Rails 3进行Ajax调用）

2 个答案: