使用Rails重寫Ajax頁面

Question

我是rails的新手，我無法理解如何重寫下一個功能。

例如：我有一個產品清單。 每個產品都有一些領域（類別）

   def index
    if params[:select_query]
      @posts = Post.selecting(params[:select_query])
    else
      @posts = Post.all   
    end

    respond_to do |format|
      format.html # index.html.erb
      format.js
    end
  end

的index.html

<%= select_tag "credit_card", options_for_select([["first", 1], ["second", 2], ["third", 3]], 2) %>
<div class='tab'>
  <%= render 'table' %>
</div>

<%= link_to 'Select', posts_path(select_query: 'first'), class: 'link', remote: true %>

index.js.erb的

$('.tab').html("<%= j render 'table' %>")

JS

$(function(){
    $('#credit_card').on('change', function(){
        variable = $(this).find('option:selected').text();
        $('.link').attr('href', '/posts?select_query='+variable).click();
    });
});

我嘗試實現相同的功能，但沒有額外的鏈接（按鈕）

完美的方式我應該只有JS文件（使用Ajax）

可以幫我改寫 ajax的這個功能。

Answer 1

你可以試試這個

$('#credit_card').on('change', function(){
  var variable = $(this).find('option:selected').text();
  $.ajax({
    url: '/posts',
    data: {select_query: variable },
    dataType: 'JS'});
});

或者如果你根本不想要js.erb。 您可以將控制器重寫為：

# ...
respond_to do |format|
  format.html # index.html.erb
  format.js { render partial: 'table' }
end

並為您的ajax請求添加成功處理程序：

$.ajax({
  url: '/posts',
  data: {select_query: variable },
  success: function(result) {
    $('.tab').html(result);
  },
  dataType: 'JS'});

Answer 2

你也可以添加success: window.location.reload()給你ajax調用