如何管理保持在同一页面上的列表元素答案

【问题标题】：How to manage a list elements staying on the same page如何管理保持在同一页面上的列表元素
【发布时间】：2017-11-20 11:10:24
【问题描述】：

默认情况下，rails 具有带有相应路由的控制器 CRUD 操作。例如，我有一个简单的书店应用程序，其中有一本书和类别。我想通过主页上的侧边栏显示所有类别。每个类别都是一个下拉元素，并带有一个书籍计数整数。展开下拉列表时，我想查看属于当前并充当链接的书名。这很容易实现。

问题是如何添加一个隐藏在下面的表单，比如说一个 + 号，如果没有，则粘贴在静态下拉部分标题“类别”旁边？

类别控制器中的创建操作表单，它允许创建一个新类别并立即显示它，而无需重定向到创建类别视图并重定向回来。

请提供任何可靠的解决方案或教程链接。非常感谢。

【问题讨论】：

标签： css ruby-on-rails ruby sass

【解决方案1】：

看起来您正在寻找 AJAX 表单。在 Rails 中，您可以使用 form_for ... remote:true 生成它。这可以在不刷新页面的情况下调用控制器方法。然后你可以返回一个响应并使用 JS 来更新用户所在的页面。

例如，在你看来

<div class="hidden">
  <%= from_for @category, remote:true %>
  Your form here
  <% end %>
</div>

添加一些 JavaScript 以在单击按钮时取消隐藏表单。在你的控制器中

def create
#normal create stuff
  if save
    respond_to do |f|
      f.js
      f.html {#re render page just in case JavaScript is disabled}
    end
  else
    #handle error
  end
end

使用 rails 默认的 f.js，Rails 将调用一个文件 create.js.erb，该文件将有权访问您创建的任何公共变量，例如 @category。

然后你可以按照

的方式做一些事情

$('.append_category').append('<%= j render 'your category layout partial', locals: { category: @category }%>');

或者如果您只需要类别链接

$('.append_category').append('<%= link_to @category %>');

一个非常好的指南可以在这里找到http://guides.rubyonrails.org/working_with_javascript_in_rails.html

注意：根据您的 rails 版本，您可能需要将 include ActionController::MimeResponds 添加到您的 application_controller.rb（我知道 rails 5 需要这样做）

【讨论】：

非常感谢。我会尝试使用它