Rails 4，选择标签onchange事件未能触发form_tag上的json答案

【问题标题】：Rails 4, select tag onchange event failed to trigger json on form_tagRails 4，选择标签onchange事件未能触发form_tag上的json
【发布时间】：2014-07-30 16:48:49
【问题描述】：

我正在编写一个需要级联选择标签的简单网站。第一个选择标签 floor_id 中的选定选项会更改第二个选择标签 space_id 中的选项。我已将这 2 个选择放入 2 个单独的表格中。问题是，选择 floor_id 中的 onchange 事件不会触发 json 更改第二个选择标签中的选项，但提交按钮会。有大神能告诉我怎么解决吗？非常感谢！

这是我在 app/controllers/spaces_controller.rb 中的代码

class SpacesController < ApplicationController

    def index
        @floors = Floor.all.order(:name)
        @spaces = Space.all.order(:name)
    end

    def list
        @floor_id = params[:floor_id]
        @spaces = Space.includes(:maps).where( \
            "maps.floor_id = ? OR 0 = char_length(?)", \
                @floor_id.to_i, \
                @floor_id.to_s, \
            ).references(:map)
        render :partial => 'list', :object => @spaces
    end
...
end

文件 app/assets/javascripts/spaces.js.coffee

$(document).ready ->
  $("#category").on("ajax:success", (e, data, status, xhr) ->
    $("#space_list").html xhr.responseText
  ).on "ajax:error", (e, xhr, status, error) ->
    $("#space_list").html "<option value=''>Error</option>"

文件 app/assets/javascripts/defaults.js

function go_to_uri
  ( iObject
  , iId
  , iAction
  )
{
  if (!iId || iId.length === 0 || iId === "" || typeof iId == 'undefined' || !/[^\s]/.test(iId) || /^\s*$/.test(iId) || iId.replace(/\s/g,"") == "")
  return false;
  this.document.location.href = iObject + "/" + iId + "/" + iAction;
  return false;
}

文件 app/views/spaces/index.html.erb

<h1>Spaces</h1>
<%= form_tag list_spaces_url, method: :post, remote: true, id: 'category' do |f| %>
  <p>
    <%= label_tag :floor_id, 'Floor' %>
    <%= select_tag \
      :floor_id, \
      options_from_collection_for_select(@floors, :id, :name), \
      include_blank: true, \
      onchange: '$(this).parent(\'form\').submit();' %>
  </p>
  <%= submit_tag %>
<% end %>

<%= form_tag 'nil', method: :get do |f| %>
  <%= label_tag :space, 'Space' %>
  <span id="space_list"><%= render 'list' %></span>
  <%= button_tag type: \
    'button', \
    onclick: 'go_to_uri("spaces", this.form.space.value, "map")' \
    do %>
      Show Map
  <% end %>
<% end %>

文件 app/views/spaces/list.html.erb

<%= select_tag \
  :space_id, \
  options_from_collection_for_select(@spaces, :id, :name), \
  include_blank: true, \
  onchange: 'go_to_uri("spaces", this.value, "map")' %>

【问题讨论】：

标签： javascript html json ruby-on-rails-4 coffeescript

【解决方案1】：

我已经用咖啡脚本重写了 onchange 事件，现在它可以工作了。

文件 app/assets/javascripts/spaces.js.coffee

$(document).ready ->
  $("#space_category").on("ajax:success", (e, data, status, xhr) ->
    $("#space_list").html xhr.responseText
  ).on "ajax:error", (e, xhr, status, error) ->
    $("#space_list").html "<option value=''>Error</option>"
  $(".space_category").change ->
    $("#space_category").submit()

文件 app/views/spaces/index.html.erb

<h1>Spaces</h1>
<%= form_tag list_spaces_url, method: :post, remote: true, id: 'space_category' do |f| %>
  <p>
    <%= label_tag :floor_id, 'Floor' %>
    <%= select_tag \
      :floor_id, \
      options_from_collection_for_select(@floors, :id, :name), \
      include_blank: true, \
      class: 'space_catefory' %>
  </p>
  <%= submit_tag %>
<% end %>

<%= form_tag 'nil', method: :get do |f| %>
  <%= label_tag :space, 'Space' %>
  <span id="space_list"><%= render 'list' %></span>
  <%= button_tag type: \
    'button', \
    onclick: 'go_to_uri("spaces", this.form.space.value, "map")' \
    do %>
      Show Map
  <% end %>
<% end %>

【讨论】：