以漂亮的方式格式化查询参数

Question

我的 Rails 项目中有一个 search 控制器，它响应我的 header 中的表单。现在，一切正常，但是当我搜索 "something" 时，我在 URL 中得到了 admin/users/search?q=something。我正在努力使它更加用户友好 URL，例如 admin/users/search/something.

我尝试将路线从 get 'search' => 'search#index' 更改为 get 'search/:q' => 'search#index', :as =>"search。但是，在我的表单上，它要求我明确地放置参数，因此 form_tag admin_search_path, :enforce_utf8 => false, :method => :GET 之类的东西不起作用，因为我需要在我的路径 admin_search_path(something).

前面加上括号

如何为我的应用程序实施 "nice" 搜索 URL？

Answer 1

您可以使用您尝试过的命名路由，并带有 :q 参数，并且在您的表单中，我们将动态地将路由参数替换为已输入的搜索词。

首先，像往常一样创建您的表单，除了将 "query" 指定为搜索参数。另外，确保搜索词字段 (#q) 而不是 具有 name 属性；没有 name 属性的表单元素不会提交到服务器：

<%= form_tag admin_search_path("query"), :enforce_utf8 => false, :method => :get %>
    <input type="text" id="q" placeholder="Enter a search term" />
    <input type="submit" value = "Search!" />
<% end %>

如果用户输入了搜索词并点击提交（或按下回车键），我们将用实际搜索词替换路由的 query 部分，这样表单 post 将匹配新命名的路由。

对于这个解决方案，有一些假设：

jQuery 已为应用程序启用
onUserSearchReady 方法（或等效方法）尚不存在

鉴于这些假设，您可以将其添加到 app/assets/javascripts/user.js 文件中：

function onUserSearchReady() {
    $.submit(function(event) {
        var form = $("form");
        var action = form.attr("action");
        var search_terms = form.find("#q").val().trim();

        if (search_terms.length > 0) {
            var new_action = action.replace(/query/, encodeURIComponent(search_terms));

            form.attr("action", new_action);
        } else {
            event.preventDefault();
        }
    });
};

然后，在 search 视图中，将此添加到视图源的底部：

<script>
jQuery(document).ready(onUserSearchReady);
// Also register appropriate TurboLinks ready callbacks, if using TurboLinks...
// jQuery(document).on('page:load', onUserSearchReady);
// jQuery(document).on('page:restore', onUserSearchReady);
</script>

现在，当用户在搜索词字段 (#q) 中输入 something 时，查询将如下所示：

GET /admin/users/search/something

这应该就可以了。

以漂亮的方式格式化查询参数

Format query paramethers in a pretty way

javascript

ruby

forms

ruby-on-rails

erb