javascript - 选择用户，然后选择他的挑战的下拉列表

Question

用户has_many个挑战。

选择用户后...

<%= f.select :user_id, options_for_select(@challengers.collect { |challenger| [challenger.full_name] }) %>

...我们如何显示另一个下拉菜单，其中包含他的挑战列表？

<%= f.select :challenge_id, options_for_select(@challenger_challenges.collect { |challenged| [challenged.full_challenge]}) %>

换句话说，我们如何才能使“@challenger_challenges = 所选用户的挑战”？

就目前情况而言，我收到错误undefined method 'collect' for nil:NilClass，因为@challenger_challenges是nil。

选项 1

在challenges_controller中我可以这样做:

@challengers = User.all
@challenger = User.find(params[:challenger_selected]) if (params[:challenger_selected]).present?
@challenger_challenges = @challenger.challenges

然后，我只需要一种在选择用户后刷新页面的方法，以便将用户 ID 作为 :challenger_selected

在参数中传递

选项 2

无需刷新页面即可实现本题目的。 *最好

更新

根据下面的评论，我意识到我需要详细说明。

用户has_many个挑战。

用户可以创建决斗。

在决斗中，有两个决斗者。

决斗的创建者选择自己的:challenge_id，然后选择另一位决斗者以及他的:challenge_id之一，然后然后设置决斗者在挑战失败时必须执行的@duel.consequence。另一名决斗者将收到决斗请求通知，然后可以选择接受或拒绝决斗条件。

challenges.show.html.erb

<%= render 'duels/form' %>

决斗/_form.html.erb

<%= simple_form_for(@duel) do |f| %>
  <%= f.fields_for :duelers do |dueler| %> 
    <%= f.hidden_field :challenge_id, :value => @challenge.id %>
    <%= @challenge.full_challenge %>
  <% end %>
  <%= f.fields_for :duelers do |dueler| %>
    <%= render 'duels/dueler_fields', :f => dueler %>
  <% end %>
  <%= button_tag(type: 'submit', class: "btn", id: "challenge-create-save")  do %>
    Request Duel
  <% end %>
<% end %>

决斗/_dueler_fields.html.erb

<%= f.select :user_id, options_for_select(@challengers.collect { |challenger| [challenger.id] }) %>

# Trying to make this responsive to the user that is selected above
<%= render 'challenges/select', :f => f %>

<script>
$('#duel_duelers_attributes_1_user_id').change(function () {
    var challenger_id = $(this).find(":selected").val();
    var address = "<%= select_path %>".concat(challenger_id);
    $.get(address, function(data) {
        $("#duel_duelers_attributes_1_challenge_id").html(data);
    });
});
</script>

路线

get 'challenges/select/:id' => 'challenges#select', as: 'select'

挑战/_select.html.erb

<%= f.select :challenge_id, options_for_select(@challenger_challenges.collect { |challenged| [challenged.full_challenge]}) %>

challenges_controller

def select
  if (params[:challenger_id]).present?
    @challenger = User.find(params[:challenger_id])
  else
    @challenger = User.find(1)
  end
  @challenger_challenges = @challenger.challenges
end

Answer 1

这应该归功于@Fallenhero - 我只是更详细地解释它。

您需要能够识别选择标签。

<%= f.select ..., :html => {:id => :first} %>

您还需要某个地方来放置第二个。

<div id="second"></div>

使用 jQuery:

$('#first').change(function () {
    var challenger_id = $(this).find(":selected").val();
    var address = "<%= [prints address to new select tag] %>".concat(challenger_id);
    $.get(address, function(data) {
        $("#second").html(data);
    });
});

Ruby 打印出来的地址应该类似于 challenges/select/，具体取决于您想要如何设计它。末尾的 / 很重要。