使用Rails重写Ajax页面

Question

I new in rails, and i can't understand how to rewrite next functionality.

For example: I have a list of products. And every product has some field ( category )

   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();
    });
});

I try to realise same functionality but without additional link ( button )

In perfect way i should have only JS file ( with Ajax )

Could help me rewrite this functionality by ajax.

Answer 1

You could try this

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

Or if you don't want the js.erb at all. You can rewrite your controller as:

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

And add success handler for your ajax request:

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

Answer 2

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