将选择值传递给控制器​​而不刷新页面（AJAX，RAILS，JS）

Question

我是使用AJAX的新手，现在我正在尝试使用一组选择框，以便当用户从第一个选择值时，第二个更新其值。我正在尝试使用AJAX，JQuery和ROR，但到目前为止，我无法从第一个框中获取值并将其传递给控制器​​以过滤第二个结果。

这是我的index.html.erb代码

<%= form_tag(posts_path, remote: true, :method => 'get', class: "forma") do %>

   <%= select_tag("box", options_from_collection_for_select(@posts, :content,     :content), :prompt => "Select") %>

       <p>

   <%= select_tag("nbox", options_from_collection_for_select(@listposts, :content,         :id), :prompt => "Select") %>

   <p>

   <%= submit_tag "Show", class: "btn btn-info" %>

    <% end %>

这是我的index.js.erb

$(document).ready(function() {

   $(".btn").on("click", function() {
           $('.table').fadeToggle();
   })

   $('#box').change(function(){
          $.ajax({ 
             type: 'POST', 
             url: '/jess/rails/dummy/app/controllers/posts_controller', 
             data: {'filter' : $(this).val() }, 
             success: function(data){
             } 
          })
          $('#nbox').fadeIn();
      $('.btn').fadeIn();
   })
})

这是我的控制器

class PostsController < ApplicationController

  respond_to :html, :js

  def new
    @post = Post.new
  end

  def create
    @posts = Post.all
    @post = Post.new(post_params)
    if @post.save
      flash.now[:notice] = "YEAH"
      respond_to do |format|
        format.html {redirect_to @post.content}
        format.js
      end
    else
      render "/"
    end
  end

  def show
    @post = Post.find(params[:id])
  end

  def index
    @posts = Post.all
    @listposts = Post.where('content LIKE ?', params[:box])
  end

  def next
     @listposts = Post.where('content LIKE ?', params[:box])
   end

  private

    def post_params
        params.fetch(:post, {}).permit(:content)
    end

end

我认为我在js.erb中的AJAX部分做错了但是我已经改变了很多次我不知道了。非常感谢您的帮助!!

Answer 1

看起来有一些小问题。

首先，看起来您正在使用的网址可能有误。如果您要在浏览器中查看该页面，则AJAX请求的URL将与URL的格式相同。

根据你提供的内容，我无法确切知道它应该是什么，但我可以举个例子。假设您只通过“http://example.com/index”（或类似的东西）访问索引页面，您还可以根据其路径调用所需的函数。如果路线是“更新”，那么它将类似于“http://example.com/update”。

基本上，不要使用文件夹路径，而是使用Web路径。

其次，您在AJAX请求中没有做任何成功回调。使用AJAX，您可以从服务器发送和接收信息，然后您必须使用JavaScript来更新您需要手动更新的内容。因此，您需要让更新操作返回一些信息，然后您可以使用这些信息来更改第二组框的状态。