【问题标题】：How to update rails page content using AJAX when select changes?选择更改时如何使用 AJAX 更新 Rails 页面内容？
【发布时间】：2013-10-26 01:49:44
【问题描述】：

我有一个属于_一堂课的@course 表单，每节课都有_many gradable_items。 course_id 是通过下拉菜单选择的。当用户更改课程选择时，表示每个 gradable_item 的嵌套输入必须更新。这可以通过页面刷新并将课程 ID 作为 url 参数传递......因此，课程 gradable_items 作为嵌套输入存在，然后可以在其中对其进行评分（并保存为graded_items）。但是，似乎 AJAX 非常适合这个。

下面的代码不起作用......我想知道我错过了什么。

course_lesson_id - 选择课程的选择菜单
"/gradable_items_input?lesson=#{el.val()}" - ajax 应该注入到函数调用的视图中的 gradable_items_inputs.js.erb 模板的 URL。
gradable_items_container - 是 AJAX 应该注入从模板返回的代码的地方

alert() 按预期触发，类被添加但没有被删除……因为我从来没有成功。

我期望发生的是：
选择菜单已更改，这将触发该功能。该函数在 course_id 菜单中获取所选项目的 id，然后使用 course_id 作为 url 参数转到 gradable_items_inputs url。当访问此模板时，它会使用 gradable_items_inputs 操作查询 Course 控制器中的数据库。此查询使用 url 参数作为课程 ID 来过滤记录并填充 gradable_items_inputs.js.erb 文件。然后，当成功时...AJAX 将 gradable_items_inputs 模板中的代码放入 id 为 #gradable_items_container 的 div 中。

我的思维过程有缺陷吗？我想答案一定是肯定的……因为它不起作用。

  jQuery ->
    el = $("#course_lesson_id")
    el.on "change", ->
    $.ajax "/gradable_items_inputs?lesson=#{el.val()}",
    beforeSend: ->
      $("#ajax_tell").addClass "is-fetching"

    success: (response) ->
      $("#gradable_items_container").html(response)

    complete: (response) ->
      $("#ajax_tell").removeClass "is-fetching"

    error: ->
      $("#{ajax_tell}").html "<p>ERROR</p>"

    timeout: 3000
    alert "test"

gradable_items_inputs.js.erb 文件：

  $('#gradable_items_container').html('

<% @gradable_items.each do |gradable_item| %>
      <%= f.simple_fields_for :graded_items do |graded_item| %> 

    <p>
    <%= gradable_item.name %>
    <%= graded_item.input :gradable_item_id, input_html: { value: gradable_item.id, }, as: :hidden %>
    <%= graded_item.input :grade, collection: gradescales(@course), label: false %>
   </p>

  <% end %> 
    <% end %>

  ');

courses_controller.rb

  def gradable_items_inputs
     @lesson = Lesson.find(params[:lesson])

     respond_to do |format|
        format.js { }
     end
 end

【问题讨论】：

标签： ruby-on-rails ajax json jquery ruby-on-rails-4

【解决方案1】：

尝试添加

dataType:'script'

到 Ajax 调用参数。这样可以保证请求格式是js。

调试 Ajax 调用的最佳方法是从双方监视它。查看您的 Rails 服务器日志以了解如何接收请求并使用您的浏览器网络检查器查看响应。

【讨论】：

【解决方案2】：

看来你还没有为 gradable_item_inputs 创建路由。

检查routes.rb，必须有以下代码：

 resources :courses do
    collection do
      get gradable_item_inputs
    end
  end

【讨论】：

我更新了上面的代码。谢谢，joreal ...有一个路由问题。谢谢莫兰...我按照你的建议添加了数据类型。