创建（rails）后如何保持在同一个选项卡（引导程序）上？答案

【问题标题】：How to stay on same tab (bootstrap) after create (rails)?创建（rails）后如何保持在同一个选项卡（引导程序）上？
【发布时间】：2020-01-23 20:31:13
【问题描述】：

我使用以下代码重定向到创建后表单所在的位置：

  if @book.save 
    redirect_to :home_index

我也有引导垂直标签，其中所有标签共享相同的 url（主页/索引）。每个选项卡上都有一个用于创建和列出已创建内容的表单。

所以在第一个选项卡上创建后，我会返回到第一个选项卡。

我的问题是，当我在第二个、第三个等选项卡上创建时，我也会回到第一个选项卡。我想留在第三个标签上。

虽然有一些关于 SO 的问题与此相关，但它们都是针对 jQuery、PHP 等的，而且我只知道 Rails，我发现它们很难使用。我怎样才能用 Rails 做到这一点？

如果有用的话，来自引导程序的标签代码：

<div class="row">
  <div class="col-3">
    <div class="nav flex-column nav-pills" id="v-pills-tab" role="tablist" aria-orientation="vertical">
      <a class="nav-link active" id="v-pills-home-tab" data-toggle="pill" href="#v-pills-home" role="tab" aria-controls="v-pills-home" aria-selected="true">Home</a>
      <a class="nav-link" id="v-pills-profile-tab" data-toggle="pill" href="#v-pills-profile" role="tab" aria-controls="v-pills-profile" aria-selected="false">Profile</a>
      <a class="nav-link" id="v-pills-messages-tab" data-toggle="pill" href="#v-pills-messages" role="tab" aria-controls="v-pills-messages" aria-selected="false">Messages</a>
      <a class="nav-link" id="v-pills-settings-tab" data-toggle="pill" href="#v-pills-settings" role="tab" aria-controls="v-pills-settings" aria-selected="false">Settings</a>
    </div>
  </div>
  <div class="col-9">
    <div class="tab-content" id="v-pills-tabContent">
      <div class="tab-pane fade show active" id="v-pills-home" role="tabpanel" aria-labelledby="v-pills-home-tab">...</div>
      <div class="tab-pane fade" id="v-pills-profile" role="tabpanel" aria-labelledby="v-pills-profile-tab">...</div>
      <div class="tab-pane fade" id="v-pills-messages" role="tabpanel" aria-labelledby="v-pills-messages-tab">...</div>
      <div class="tab-pane fade" id="v-pills-settings" role="tabpanel" aria-labelledby="v-pills-settings-tab">...</div>
    </div>
  </div>
</div>

【问题讨论】：

标签： ruby-on-rails twitter-bootstrap bootstrap-4

【解决方案1】：

我可以想到几种方法来实现这一点：

使用 ajax 请求触发标签创建，然后从控制器响应新标签的 html 并将其插入 DOM，然后在收到 ajax 响应时在客户端切换到它。或者...
在页面加载时调用的 javascript 通过检查 html 查询字符串暴露了选项卡。例如www.mypage.com?tab=foo_tab 在页面加载时打开 foo_tab。在控制器中，创建后重定向到查询中指定的所需选项卡的页面。

我会选择第一种方法，b/c 用户体验会比新页面加载更好。

【讨论】：