小编Nik*_*sev的帖子

如何在导航栏中创建100%的搜索输入宽度？

该领域的宽度有限:

<nav class="navbar navbar-light navbar-dark bg-inverse">
  <a class="navbar-brand" href="#">Navbar</a>
  <ul class="nav navbar-nav">
    <li class="nav-item active">
      <a class="nav-link" href="#">Home <span class="sr-only">(current)</span></a>
    </li>
    <li class="nav-item">
      <a class="nav-link" href="#">Features</a>
    </li>
    <li class="nav-item">
      <a class="nav-link" href="#">Pricing</a>
    </li>
    <li class="nav-item">
      <a class="nav-link" href="#">About</a>
    </li>
  </ul>

  <ul class="nav navbar-nav pull-xs-right">
    <li class="nav-item">
      <form class="form-inline ">
        <input class="form-control" type="text" placeholder="Search">
        <button class="btn btn-outline-success" type="submit">Search</button>
      </form>
    </li>
    <li class="nav-item">
      <a class="nav-link" href="#">User Name</a>
    </li>
  </ul>
</nav>

这是小提琴:

https://jsfiddle.net/Dieselnick/tdoz2o4d/

已经有一个月试图一眼就解决问题并不是很复杂:有3个模型 - 团队,用户和team_user(has_namy:through)以编辑和新团队的形式,能够动态添加该团队的成员.

场景:

• 用户加入团队新表单
• 表示团队的名称
• 在名称字段之后选择用户(团队成员)
• 单击"添加成员"按钮
• 验证成员后,在文本字段+删除按钮对面的团队名称字段后添加
• 从选择器中删除他的(成员)名称(因为它已经是团队成员)
• 在selite中选择下一个用户,然后单击"添加成员"按钮
• 按"提交"按钮以保存新团队和团队成员

难点:

• 我试图通过gem Cocoon,但是不可能做出不同的parshaly来选择要添加到它的用户(SELECT)并添加了成员​​(全名 - 文本)
• 如果通过<%= from_for ... remote:true%>以及控制器teams_controller中的单独控制器或新操作完成,它将是两种形式的嵌套(形状和表单团队team_user)及其第二个提交按钮.据我所知,附件表格不是gud.
• 表单中的更改(更改团队名称和添加/删除团队成员只有在单击保存后基本上提交表单团队才有计数)

应用程序/模型/ user.rb

class User < ApplicationRecord
  has_many :team_users
  has_many :teams, through: :team_users
  accepts_nested_attributes_for :team_users, :teams, allow_destroy: true
end

应用程序/模型/ team.rb

class Team < ApplicationRecord
  has_many :team_users
  has_many :users, through: :team_users
  accepts_nested_attributes_for :team_users, allow_destroy: true, reject_if: proc { |a| a['user_id'].blank? }
end

应用程序/模型/ team_user.rb

class TeamUser < ApplicationRecord
  belongs_to :team
  belongs_to :user
  accepts_nested_attributes_for :team, :user, allow_destroy: true
end

应用程序/控制器/ …