Question

AJAX和搜索新手。我觉得我距离这个还有一英寸远，但我不知道该修复什么。此外，我的控制器现在看起来真的很hacky。

无论如何，我正在尝试创建一个搜索，允许用户使用AJAX搜索我页面上的博客帖子。以下是（相关部分）部分：

posts_controller.rb

def show
  @posts = Post.all.reverse
  @post = Post.find(params[:id])
  @link_num = 10

  respond_to do |format|
    format.html # show.html.erb
    format.json { redirect_to @post }
  end
end

def search
  @link_num = 10
  @posts = Post.all.reverse
  @post = Post.find(params[:id])

  #The including function returns the search results
  @search = Post.first.including(params[:term])
  render 'show'
end

这里的“hacky”让我感到震惊的是，我重复了所有变量赋值（还有其他我没有表现出因为它们不相关）。理想情况下，AJAX调用不应该重新定义/重新加载所有这些变量吗？另外，我必须通过隐藏字段将id传递给我的搜索操作。这对我来说很奇怪/错误。

show.html.erb

<h1 class="squeeze">Recent Posts</h1>
  <%= form_tag("/search", method: "get", class: "search") do %>
        <%= text_field_tag(:term, '', placeholder: "Search posts:") %>
        <%= hidden_field_tag(:id, @post.id) %>
        <%= submit_tag("Search", class: "btn search_button", remote: true) %>
    <% end %>
  <% if !@search%>
    <ul>
        <% @posts.first(@link_num).each do |p| %>
            <li><a href=<%= p.id %> ><%= p.name %> <span class="manual_small">(<%= p.created_at.strftime("%b %d, %Y") %>)</span></a></li>
        <% end %>
        <% if @posts.length > @link_num %>
            <div class="link_disclaimer">
            <h4>---</h4>
            <h5><%= "Only showing #{@link_num} most recent posts." %></h5>
            <h5>Search to narrow results.</h5>
        </div>
        <% end %>
    </ul>
  <% elsif @search.empty? %>
    <h3>Term not found!</h3>
  <% else %>
    <ul>
        <% @search.first(@link_num).each do |p| %>
            <li><a href=<%= p.id %> ><%= p.name %> <span class="manual_small">(<%= p.created_at.strftime("%b %d, %Y") %>)</span></a></li>
        <% end %>
        <% if @search.length > @link_num %>
            <div class="link_disclaimer">
                <h4>---</h4>
                <h5><%= "Only showing first #{@link_num} relevant hits." %></h5>
                <h5>Narrow search for more specific results.</h5>
            </div>
        <% end %>
    </ul>
  <% end %>

的routes.rb

match '/search', to: 'posts#search'

目前，搜索本身运行良好，有三个主要问题：

我的控制器的上述混乱。
整个页面重新加载的事实。这与AJAX应该做的相反吗？如何让它重新加载链接列表？
网址。它超级凌乱（即“/ search？utf8 =✓＆amp; term = limits＆amp; id = 11＆amp; commit = Search”）。我理想情况下它仍然不受搜索的影响，但如果这不可能，可能就像“/ search？=”。怎么做的？

Answer 1

基于此处的评论是使该功能正常工作的基本逻辑（很抱歉没有实际代码，因为这太费时了）

在控制器中，您可以使用“搜索”方法。该方法需要一个参数，即搜索的短语。它从db获取结果并仅使用结果响应JSON。
在模板中，您有一个搜索表单。
在JS中，您可以监听用户单击提交按钮的事件，捕获他们编写的字符，并将其处理为ajax函数。
编写Ajax代码，首选使用jQuery的ajax（）。基本上使用ajax（）将输入的字符作为参数发送到＃1中的控制器方法。然后ajax（）将从服务器获得响应（搜索结果）。
更新DOM中的结果。您可以添加新的div来显示搜索结果，也可以替换当前的主要内容div来显示结果。

Rails AJAX搜索表单重新加载页面

1 个答案: