Ruby on Rails select2 提交不起作用

Question

  https://select2.org/getting-started/basic-usage

我想像上面链接中的第一个示例一样搜索帖子标题。

代码：

<!-- search -->
      <div class="card my-auto">
        <%= form_with url: posts_path, method: :get, local: :true do |f| %>
          <div class="card-body">
            <p>Search for a Post title.</p>
            <%= f.collection_select(:post_id, Post.all, :id, :title, {include_blank: 'Post titles'}, {class:'selectbooktitle form-control'}) %>
            <hr>
            <div class="input-group">
                <span class="input-group-btn">
                  <%= f.submit 'Search', class: 'btn btn-outline-success'%>

                </span>
        <% end %>
        </div>
        </div>
      </div>

这是单击提交时来自我的服务器的请求。

Started GET "/posts?utf8=%E2%9C%93&post_id=16&commit=Search" for 127.0.0.1 at 2018-05-09 14:18:51 +0200
Processing by PostsController#index as HTML
  Parameters: {"utf8"=>"✓", "post_id"=>"16", "commit"=>"Search"}
  Rendering posts/index.html.erb within layouts/application
  Post Load (0.3ms)  SELECT "posts".* FROM "posts"
  Post Load (0.3ms)  SELECT "posts".* FROM "posts" ORDER BY created_at DESC
  User Load (0.3ms)  SELECT  "users".* FROM "users" WHERE "users"."id" = $1 LIMIT $2  [["id", 2], ["LIMIT", 1]]
  CACHE User Load (0.0ms)  SELECT  "users".* FROM "users" WHERE "users"."id" = $1 LIMIT $2  [["id", 2], ["LIMIT", 1]]
  CACHE User Load (0.0ms)  SELECT  "users".* FROM "users" WHERE "users"."id" = $1 LIMIT $2  [["id", 2], ["LIMIT", 1]]
  CACHE User Load (0.0ms)  SELECT  "users".* FROM "users" WHERE "users"."id" = $1 LIMIT $2  [["id", 2], ["LIMIT", 1]]
  User Load (0.2ms)  SELECT  "users".* FROM "users" WHERE "users"."id" = $1 LIMIT $2  [["id", 1], ["LIMIT", 1]]
  User Load (0.2ms)  SELECT  "users".* FROM "users" WHERE "users"."id" = $1 LIMIT $2  [["id", 4], ["LIMIT", 1]]
  Rendered posts/index.html.erb within layouts/application (10.2ms)
  Category Load (0.3ms)  SELECT "categories".* FROM "categories"
  User Load (0.3ms)  SELECT  "users".* FROM "users" WHERE "users"."id" = $1 ORDER BY "users"."id" ASC LIMIT $2  [["id", 2], ["LIMIT", 1]]
  Rendered layouts/_navbar.html.erb (4.5ms)
  Rendered layouts/_alerts.html.erb (0.4ms)
  Rendered layouts/_footer.html.erb (0.6ms)
Completed 200 OK in 59ms (Views: 55.0ms | ActiveRecord: 1.9ms)

指向此 URL：

http://localhost:3000/posts?utf8=%E2%9C%93&post_id=20&commit=Search

它应该指向以下 URL：

http://localhost:3000/posts/20

我做错了什么？

提前感谢您的帮助！

Answer 1

Rails 框架将您发送到该 URL 并没有错，因为您将 form_with :url 选项设置为 posts_path。这等于/posts。

您要做的是根据选择的内容更改表单操作。为此，您需要 JavaScript 来动态更改表单操作。

这是一个简化的例子：

app/views/some_directory/some_file.html.erb

<%= form_with url: posts_path, method: :get, local: true do |form| %>
  <% options = {include_blank: 'Post titles'} %>
  <% html_options = {
     class: 'selectbooktitle form-control', 
     'data-change-form-action-with-value': true,
  } %>

  <%= form.collection_select :post_path, Post.all, method(:post_path), :title, options, html_options %>
  <%= form.submit 'Search', class: 'btn btn-outline-success'%>
<% end %>

app/assets/javascripts/some_file.coffee

initChangeFormActionWithValue = (selectElement) ->
  selectElement       = $(selectElement)
  closestAncestorForm = selectElement.closest('form')

  selectElement.on 'change', ->
    closestAncestorForm.attr 'action', selectElement.val()

$(document).on 'turbolinks:load', ->
  $('select[data-change-form-action-with-value="true"]')
    .each -> initChangeFormActionWithValue(this)

现在，当更改选择值时，表单会更新为所选选项的值（包含发布路径）。当您提交请求时，您将请求GET /posts/:id。

注意：这是一个简化的解决方案。哪个请求所选帖子的GET /posts/:id。然而，表单的值也会被提交。您可以不处理它们，但至少应该知道它们在那里。因此，当您在节目中看到 post_path 或 submit 参数时，您不会感到惊讶。

此外，如果您在按下提交时根本不更改选择，您目前只需请求GET /posts。如果您将选择值更改为帖子并返回到'Post titles'（空白值），则该操作将被清除。这意味着您将获得当前 URL。

---

或者，您可以使用当前的解决方案。如果params[:post_id] 存在，则在您的PostsController#index 重定向到PostsController#show。

class PostsController < ApplicationController

  def index
    return redirect_to post_path(params[:post_id]) if params[:post_id]

    # other index code
  end

end