我有一个属于类(class)的@course 表单,并且每节类(class)都有很多可评分的项目。 Lesson_id 通过下拉菜单选择。当用户更改类(class)选择时,必须更新代表每个 gradable_item 的嵌套输入。这可以通过页面刷新并将 Lesson_id 作为 url 参数传递来实现...因此,该类(class) gradable_items 作为嵌套输入存在,然后可以在其中对其进行评分(并保存为 Graded_items)。但是,AJAX 似乎非常适合此操作。
下面的代码不起作用......我想知道我错过了什么。
course_lesson_id - 选择类(class)的选择菜单
“/gradable_items_input?lesson=#{el.val()}” - gradable_items_inputs.js.erb 模板的 URL,ajax 应将其注入(inject)到发起函数调用的 View 中。
gradable_items_container - AJAX 应注入(inject)从模板返回的代码的位置
alert() 按预期触发,并且类被添加但没有删除......因为我从未成功。
我期望发生的是这样的:
选择菜单更改,这会触发该功能。该函数获取 Lesson_id 菜单中所选项目的 ID,然后使用 Lesson_id 作为 url 参数转到 gradable_items_inputs url。访问此模板时,它会使用 gradable_items_inputs 操作查询类(class) Controller 中的数据库。此查询使用 Lesson_id 的 url 参数来过滤记录并填充 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
最佳答案
尝试添加
dataType:'script'
Ajax 调用参数。这样就保证了请求格式是js。
调试 Ajax 调用的最佳方法是从两侧监视它。查看 Rails 服务器日志以了解如何接收请求,并使用浏览器网络检查器查看响应。
关于ruby-on-rails - 选择更改时如何使用 AJAX 更新 Rails 页面内容?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/19601940/