html - IDが重複しているため、選択ボックスが1つしか表示されません

Question

チェックボックスに応じて3つの選択ボックスが存在するフォームがあります.jQueryを使用して、アクティブなチェックボックスに応じてそれらを表示/非表示にしています。以下fは、player

<% Game.all.each_with_index do |game, i| %>
  <div class="team_<%= i %> hide">
    <%= f.collection_select(:team_division_id, TeamDivision.where("game_id = ?", game.id), 
                            :id, :name, include_blank: true) %>
  </div>
<% end %>

コレクションの選択ごとに id が生成されますplayer_team_division_id- ページには 1 つの id しか存在できないため、これは私の結果を本当に台無しにしています。つまり、最初の選択ボックスは正常に表示されますが、他の選択ボックスは単純なリンクとして表示されjavascript:void(0)ます生成された div を firebug/chrome で出力すると、情報はそこにありますが、ID のために (おそらく) 選択ボックスとして表示されません。それが違いを生む場合、私はchoose.jsを使用していますが、これは何の影響もないと思います。

編集 (モデル) :

class Player < ActiveRecord::Base
  belongs_to :game
  belongs_to :team_division, touch: true
end

class Game < ActiveRecord::Base
  has_many :players
  has_many :team_divisions
end

Class TeamDivision < ActiveRecord::Base
  has_many :players
  belongs_to :game
end