模型

Question

我已经在这个问题上挣扎了几天，每次当我认为我得到了技巧时，我都错过了，所以我在寻求你的帮助！所以我一直在做一个私人导师中心项目，我需要有一个动态选择框，其中包含基于前一个选择框的值。我已经按照教程：https://kernelgarden.wordpress.com/2014/02/26/dynamic-select-boxes-in-rails-4/

对于我的工作：

模型

student.rb

class Student < ApplicationRecord
   has_many :cases
end

case.rb

class Case < ApplicationRecord
    belongs_to :category
    belongs_to :student
    belongs_to :subject
end

category.rb

class Category < ApplicationRecord
   has_many :cases
   has_many :subjects
end

subject.rb中

class Subject < ApplicationRecord
   belongs_to :category
   has_many :cases
end

路线

的routes.rb

resources :students do
    resources :cases do
      get 'update_subjects', to: 'cases#update_subjects'
    end
end

控制器

cases_controller.rb

class CasesController < ApplicationController

before_action :set_student, only: [:new]

def index
end

def show
end

def new
  @case = @student.cases.build
  @categories = Category.all
  @subjects = Subject.where("category_id = ?", Category.first.id)
end

def update_subjects 
  @subjects = Subject.where("category_id = ?", params[:category_id])
  respond_to do |format|
    format.js 
  end
end

private
def case_params....

查看

视图/箱子/ _form.html.erb

<%= form_for [@student, @case] do |f| %>

.....

<%= f.select :category_id, options_for_select(@categories.collect { |category| [category.category_name.titleize, category.id]}, 1), {},{ id: 'categories_select' } %>
<%= f.label 'Please select the category' %>

<%= f.select :subject_id, options_for_select(@subjects.collect { |subject|[subject.subject_name.titleize, subject.id]}, 0), {},{ id: 'subjects_select' } %>
<%= f.label 'Please select the subject' %>

....

视图/箱子/ update_subjects.js.erb

$("#subjects_select").empty().append("<%=j render(@subjects) %>")

视图/主题/ _subject.html.erb

<option value="<%= subject.id %>"><%= subject.subject_name.titleize %></option>

AJAX

资产/ Javascript角/ cases.js.coffee

$ ->
$(document).on 'change', '#categories_select', (evt) ->
$.ajax 'update_subjects',
  type: 'GET'
  dataType: 'script'
  data: {
    category_id: $("#categories_select").val()
  }
  error: (jqXHR, textStatus, errorThrown) ->
    console.log("AJAX Error: #{textStatus}")
  success: (data, textStatus, jqXHR) ->
    console.log("Dynamic country select OK!")

资产/ Javascript角/ application.js中

//= require rails-ujs
//= require jquery
//= require jquery_ujs
//= require turbolinks
//= require_tree .

Rails详情

Ruby版本= 2.4.1 Rails版本= 5.1.1

主要问题

ajax确实有效，但它返回 AJAX错误：parsererror ，没有任何控制器错误。所以，我搜索了一下pasererror，我知道dataType期望一个javascript格式作为回报，所以我在safari上查看我的开发人员工具。从工具中，每当我在类别字段中选择一个选项时，我都会看到有一个XHRs文件夹。在该文件夹中，我可以看到一个包含html文件的文件，最有趣的是我认为 update_subjects 方法不起作用，因为在文件内部，它显示（因为我在我的内部使用了调试器）代码）：

<pre class="debug_dump">--- !ruby/object:ActionController::Parameters parameters: !ruby/hash:ActiveSupport::HashWithIndifferentAccess category_id: '3' _: '1498731378829' ===> **I don't know what is this controller: cases action: show ===> obvious the action is on case#show student_id: '1' id: update_subjects permitted: false </pre>

并在终端：

Started GET "/students/1/cases/update_subjects?category_id=3&_=1498731378829" Processing by CasesController#show as JS Parameters: {"category_id"=>"3", "_"=>"1498731378829", "student_id"=>"1", "id"=>"update_subjects"} Rendering cases/show.html.erb within layouts/application Rendered cases/show.html.erb within layouts/application (0.6ms) Student Load (0.4ms) SELECT "students".* FROM "students" WHERE "students"."id" = $1 LIMIT $2 [["id", 1], ["LIMIT", 1]] Rendered students/_nav_after_login.html.erb (0.8ms) [cache miss] Completed 200 OK

对于这么长的段落感到抱歉，因为我想尽可能多地为您提供解决方案。我认为我的工作和教程之间的主要区别是我的CASE基于学生，我不知道路线或什么......或者我可能有拼写错误???? 感谢您的帮助!!!

Answer 1

路线get 'update_subjects', to: 'cases#update_subjects' 与下面的宁静路线相冲突

/students/:student_id/cases/:id/ case#show

所以它是路由到错误的方法（它应该路由到update_subjects而不是）

Started GET
"/students/1/cases/update_subjects?category_id=3&_=1498731378829" 
Processing by CasesController#show as JS
Parameters: {"category_id"=>"3", "_"=>"1498731378829", "student_id"=>"1", "id"=>"update_subjects"}

这是你的问题的原因。

<强> 解决方案：

纠正您的路线！

resources :students do
 resources :cases
end
get '/update_subjects', to: 'cases#update_subjects'

并在 AJAX 电话中使用'/update_subjects'代替'update_subjects'

Answer 2

您在ajax通话中的路线不正确。

更正后的代码：

$.ajax '/update_subjects',
  type: 'GET'
  dataType: 'script'
  data: {
    category_id: $("#categories_select").val()
  }
  error: (jqXHR, textStatus, errorThrown) ->
    console.log("AJAX Error: #{textStatus}")
  success: (data, textStatus, jqXHR) ->
    console.log("Dynamic country select OK!")

Answer 3

我认为你的问题与路线有关，你应该在ajax调用上使用：

/students/:student_id/cases/:case_id/update_subjects?...

而不是：

/students/1/cases/update_subjects?...

您可以在终端上执行：

rake routes

这将输出所有可用的路线。

动态选择字段轨道（ajax / jquery）

模型