如何将 ajax 请求转换为不显眼的 javascript？答案

【问题标题】：How to convert ajax request to unobtrusive javascript?如何将 ajax 请求转换为不显眼的 javascript？
【发布时间】：2017-01-03 19:39:22
【问题描述】：

我有一个 ajax 代码：

$('select#books_order').on('change', function() {
  $.ajax({
    url: "/books/#{@book.id}",
    type: 'GET',
    dataType: 'script',
    data: {
     sort: $('#books_order option:selected').val()
    }
  });
});

可以解释成这样的

select#books_order data-remote="true" data-url="/books/#{@book.id}" data-method="get"
  option value='desc' Descending
  option value='asc' Ascending

但是，我不知道如何将 sort 参数传递给操作。在第一个示例中，我只是使用 JQuery 来获取选定的选项，但是我的第二个示例发送了一个不带参数的请求。

【问题讨论】：

slim 真的和这个有关系吗？
@cale_b 我用它是为了理解
您可以将您的 JavaScript 移动到您的 assets 并使用 data 属性 (railscasts.com/episodes/…) 将 book_id 传递给它
尝试在网址末尾添加.js

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

【解决方案1】：

你可以给data-url添加一个url参数。

select#books_order data-remote="true" data-url="/books/#{@book.id}?sort=desc" data-method="get"

或者您可以制作一个隐藏表单并在更改时提交，这将通过 ujs 提交带有排序参数的表单/操作。

JS：

$('#books_order').on("change blur", function() {
  // Submit form
  $(this).trigger('submit.rails');
});

在您的视图/表单中：

<%= form_tag book_path(@book) do %>
  <%= select_tag :sort, options_for_select([['Descending', 'desc'], ['Ascending', 'asc']])
<% end %>

在您的控制器中：

params[:sort]

【讨论】：