@challenges = {динамически меняющийся пользователь} .challenges

Question

Когда выбрано :user_id, как мы можем показать в следующих collection_select проблемы пользователя? Другими словами, как мы можем сделать

@challenges = @user.challenges.order(:created_at) 

Например,

Как вы можете видеть все вызовы перечислены и даже если я изменю user все проблемы по-прежнему в списке. Javascript никогда не пинает, чтобы просто перечислить проблемы для этого соответствующего пользователя.

схема

create_table "duelers", force: true do |t| 
    t.integer "user_id" 
    t.integer "challenge_id" 
    t.datetime "created_at",  null: false 
    t.datetime "updated_at",  null: false 
    t.integer "duel_id",  null: false 
    t.boolean "accept" 
    t.string "user_name" 
    t.string "user_last_name" 
    t.string "challenge_name" 
    end 

    add_index "duelers", ["duel_id"], name: "index_duelers_on_duel_id", using: :btree 

    create_table "duels", force: true do |t| 
    t.text  "consequence" 
    t.text  "reward" 
    t.datetime "created_at", null: false 
    t.datetime "updated_at", null: false 
    end 

модели

class Duel < ActiveRecord::Base 
    belongs_to :user 
    belongs_to :challenge 
    has_many :duelers 
    accepts_nested_attributes_for :duelers, :reject_if => :all_blank, :allow_destroy => true #correct 
end 

class Dueler < ActiveRecord::Base 
    belongs_to :user 
    belongs_to :challenge 
    belongs_to :duel 
end 

маршруты

get 'duels/user_challenges', :to => 'duels#user_challenges', as: 'user_challenges' 

duels_controller

def user_challenges 
    @user = User.find(params[:id]) 
    @challenges = @user.challenges.order(:created_at) 
end 

def new 
    @duel = Duel.new 
    @duel.duelers << Dueler.new(user_id: current_user.id, user_name: current_user.name, user_last_name: current_user.last_name) 
respond_with(@duel) 
end 

дуэлей/_form

<%= simple_form_for(@duel) do |f| %> 
    <%= f.fields_for :duelers do |dueler| %> 
    <%= render 'dueler_fields', :f => dueler %> 
    <% end %> 
    <%= link_to_add_association f, :duelers do %> 
    + Dueler 
    <% end %> 
    The loser(s) will <%= f.text_field :consequence, placeholder: "Enter Consequence" %> 
<% end %> 

дуэлей/_dueler_fields.html.erb

<%= f.select :user_id, User.order(:name).map { |user| [user.full_name, user.id] }, include_blank: true, id: "change-challenge-options" %> 

    will 

<%= render partial: 'user_challenges', locals: { challenges: Challenge.order(:created_at) } %> 

<script> # Upon changing :user_id this javascript never triggers, how to fix it? Not sure if just javascript problem or also controller or ruby 
    $("#change-challenge-options").change(function() { 
     $.ajax({ 
      type: "GET", 
      url: '<%= user_challenges_path %>', 
      data: {name: $('#change-challenge-options').prop('value')} 
     }); 
    }); 
</script> 

поединках/_user_challenges.html.erb

<div id="dropdown-no-2"> 
    <%= collection_select(:dueler, :challenge_id, challenges, :id, :full_challenge, include_blank: true) %> 
</div> 

user_challenges.js.erb

$("#dropdown-no-2").html('<%=j render :partial => "user_challenges", locals: {challenges: @challenges} %>'); 

Answer 1

Эта линия то, что вам нужно изменить:

$("#change-challenge-options").change(function() { 

Проблема в том, что селектор DOM в настоящее время работают до страница находится в готовом состоянии. Если вы выполните некоторые тесты, подобные этому

var nodes = $("#change-challenge-options") 
console.log(nodes.length) 

Возможно, вы увидите, что список узлов пуст.

На статическом веб-сайте вы можете обернуть его в $(function(){}) или document.ready(function(){}), но Rails делает его немного сложнее, добавляя turbolinks.

В приложении Rails у вас есть несколько вариантов.

Вы можете последовать совету here и обернуть ваш DOM-код, связанный в специальном слушателю:

$(document).on('turbolinks:load', function() { 
    $("#change-challenge-options").change(function() { 
     ... 
    } 
}); 

ИЛИ вы можете следовать советам из jquery.turbolinks камня. Вы бы сначала установить камень и добавить зависимость к application.js, то вы бы реорганизовать свой код следующим образом:

1. Bind ваши события вне от document.ready блока. Это может показаться противоречивым; все это время я советовал поставить все в, которые блокируют.

2. реорганизовать change слушателю использовать следующий синтаксис:

   $(document).on('change', '#change-challenge-options', function() { 
       ... 
   }) 
   

Если все это оказывается трудным, вы можете удалить turbolinks ссылки из Gemfile, application.js и application.html.erb , Тогда типичного кода document.ready было бы достаточно:

$(function(){ 
    <all your custom code> 
})