Ajax 以 formtastic 形式调用 <select>

Question

我需要在我的应用程序中从提供者列表中 select 提供者，然后通过 ajax，我可以在下面看到属于特定提供者的类别列表。我在 activeadmin 中有一个表格：

<%= semantic_form_for [:admin, @game], builder: ActiveAdmin::FormBuilder do |f| %>
  <%= f.semantic_errors :state %>
    <%= f.inputs do %>
        <%= f.input :categorization_id, label: 'Provider', as: :select,
                    collection: Provider.all.map { |provider| ["#{provider.name}", provider.id] },
                    input_html: { class: (:provider_select), 'data-url': category_select_path(provider: 4) } %>
        <%= f.input :categorization_id, label: 'Category',input_html: { class: ('category_dropdown') }, as: :select,
                    collection: Category.all.map { |category| ["#{category.name}", category.id]}%>
        ...

    <% end %>
  <%= f.actions %>
<% end %>

在 activeadmin 控制器中我有：

controller do
  def ajax_call
      @provider = Provider.find(params[:provider])
      @categories = @provider.categories
      respond_to do |format|
        format.json { render json: @categories }
      end
    end
end

JS:

$(document).on('ready page:load', function () {

  $('.select.input.optional').last().addClass('hidden_row');

  $('#game_categorization_id').change(function () {
    var id_value = this.value;
    $('.hidden_row').removeClass('hidden_row');
    $.ajax({
      type: 'GET',
      url: '/admin/games/category_select'
      // data: id_value
    })
  });

});

以及路线：match '/admin/games/category_select' => 'admin/games#ajax_call', via: :get, as: 'category_select'

我不知道如何将提供商 ID 从集合传递到 url。目前，我有category_select_path(provider: 4)，但实际上它必须是smth。像这样 - category_select_path(provider: provider.id) 在浏览器中，在 devtools 的 Network 选项卡中我可以看到我的 category_select，但是有一个错误：Couldn't find Game with 'id'=category_select。我不知道它是从哪里来的。有什么建议么？谢谢。

Answer 1

问题出在路由中：match '/admin/games/category_select' => 'admin/games#ajax_call', via: :get, as: 'category_select'。它由 Activeadmin 控制器的 show 操作保留。所以我将我的路由更改为：get '/admin/select_category' => 'admin/games#get_providers_categories', as: 'select_category'，并添加到 ajax 调用 data: {provider: provider}，这样我就可以触发提供者的参数 ID：

$.ajax({
      type: 'GET',
      url: '/admin/select_category',
      data: {
        provider: provider
      },
      success: (function (data) {
          $('#select_category').children('option').remove();
          $('#select_category').prepend('<option value=""></option>');
          $.each(data.categories, function () {
            $('#select_category').append('<option value="' + this.id + '">' + this.name + '</option>')
          })
      })
    })

Ajax 以 formtastic 形式调用 <select>

Ajax call on a <select> in a formtastic form

ajax

ruby-on-rails

formtastic

activeadmin