動態選擇菜單導軌4

我正在嘗試使用此guide製作動態選擇菜單;但是，它似乎並沒有改變select select語句。動態選擇菜單導軌4

這裏是我有儘可能代碼：

#characters_controller.rb 
    def new 
     @skills = Skill.all 
     @classes = Classe.all 
     @background = Background.all 
     @character = Character.new 
    end 
    def update_classe_skills 
     classe = Classe.find(params[:character][:classe_id]) 

     @skills = classe.skills.map{|a| [a.name,a.name]}.insert(0,"Select a Skill") 
     respond_to do |format| 
      format.js 
     end 
    end 


#routes.rb 
Rails.application.routes.draw do 
    resources :characters 
    get 'characters/update_classe_skills', :as => 'update_classe_skills' 
end

這是.js.erb文件：

#update_classe_skills.js.erb 

$('#character_classe_skill_option_one').html("<%= escape_javascript(options_for_select(@skills)) %>");

這是我的AJAX腳本：

#skills_select_handler.js 
$(document).ready(function() { 
    $(document).on('change','#character_classe_id', function() { 
     $.ajax({ 
     url: "#{update_classe_skills_path}", 
     data: { 
      classe_id : $('#character_classe_id').val() 
     }, 
     dataType: "script", 
     type: 'GET' 
     }); 
    }); 
});

最後，這是我的選擇菜單：

#new.html.erb 
<%= javascript_include_tag "skills_select_handler.js" %> 
<%= form_for :character, url: characters_path, method: :post do |f| %> 
    <%= render :partial => "info_step", :locals => {:f => f} %> 
    <%= render :partial => "rand_prompt_step", :locals => {:f => f} %> 
    <%= render :partial => "skills_step", :locals => {:f => f}%> 
<% end %> 
#_info_step.html.erb 
<p> 
    <%= f.label :classe_id, "Class" %><br> 
    <%= f.select :classe_id, options_for_select([["Barbarian", 1], ["Bard", 2], ["Cleric", 3], ["Druid", 4], ["Fighter", 5], ["Monk", 6], ["Paladin", 7], ["Ranger", 8], ["Rogue", 9], ["Sorcerer", 10], ["Warlock", 11], ["Wizard", 12]], selected: "#{@character.classe_id}"), include_blank: true, id:'character_classe_id' %> 
    <span><%= @character.errors[:classe_id][0] %></span> 
</p> 

#_skills_step.html.erb 
<div id="classe_skill_proficiency_one"> 
    <p> 
     <%= f.label :classe_skill_option_one, "Skill Proficiency" %> 
     <br> 
     <%= f.collection_select(:classe_skill_option_one, @skills, :name, :name,{:prompt => "Select a Skill"}, {id: 'character_classe_skill_option_one'})%> 
    </p> 
</div>

我曾經讓所有部分渲染出'新'視圖，但是，這是行不通的。我嘗試過自己排除故障，所以事情可能會變得有點過分。

當我看到在服務器控制檯上改變了下課，我看到以下內容：

Processing by CharactersController#new as JS 
    Parameters: {"classe_id"=>"1", "_"=>"1454977094482"} 
    [list of stuff being loaded and rendered] 
    Skill Load (0.0ms) SELECT "skills".* FROM "skills"

所以這使我相信它是儘可能的AJAX請求領先，但隨後只是用來加載整個技能列表，而不是加入特定班級的技能。

連接表製作正確，所以這不是問題。

任何人有任何想法如何讓選擇菜單來改變它的選項？

來源

2016-02-09 ANinjaSloth

這樣做：

#config/routes.rb 
resources :characters 
    get "update_classe_skills/:classe_id", as: 'update_classe_skills', on: :collection #-> url.com/characters/update_classe_skills/:classe_id 
end 

#skills_select_handler.js 
$(document).on("change","#character_classe_id", function(e) { 
    var classe_id = $(this).val(); 
    $.ajax({ 
    url: "characters/update_classe_skills/" + classe_id, 
    data: { classe_id : classe_id }, 
    dataType: "script", 
    type: 'GET' 
    }); 
}); 

#app/controllers/characters_controller.rb 
class CharactersController < ApplicationController 

    def update_classe_skills 
     @classe = Classe.find params[:classe_id] 
     respond_to do |format| 
     format.js 
     end   
    end 

end 

#app/views/characters/update_classe_skills.js.erb 
$('select#character_classe_skill_option_one').empty.append("<%=j options_from_collection_for_select(@skills, 'name', 'name') %>");

我相信你已經在你的代碼的幾個誤區：

你ajax URL是一個JS值（classe_id）的依賴，但你不沒有它
你的update_classe_skills JS不更新select（只有容器div）
你的控制器的方法是低效

來源

2016-02-09 11:28:03

我最終計算出來。它最終成爲一個路線問題。

我改變了以下內容：

#characters_controller.rb 
def update_classe_skills 
    classe = Classe.find(params[:classe_id]) 

    @skills = classe.skills.map{|a| [a.name,a.name]}.insert(0,"Select a Skill") 
    respond_to do |format| 
     format.js 
    end 
end 


#skills_select_handler.js 
$(document).ready(function() { 
    $(document).on('change','#character_classe_id', function() { 
     $.ajax({ 
     url: "/update_classe_skills", 
     data: { 
      classe_id : $('#character_classe_id').val() 
     }, 
     dataType: "script", 
     type: 'GET' 
     }); 
    }); 
}); 

#routes.rb 
Rails.application.routes.draw do 
    resources :characters 
    match "/update_classe_skills", :to => "characters#update_classe_skills", :via => [:get] 
end

我也不得不加入protect_from_forgery_except :update_classe_skills到我的人物控制器。

發生這種情況的原因是因爲我的路線中產生了resources :characters的展示路線。它正在尋找/characters/:id，因此我的路線正在按照路線進行處理，並且沒有搜索結果，因爲沒有:id => "update_classe_skills"

來源

2016-02-09 16:21:49 ANinjaSloth

動態選擇菜單導軌4

回答

相關問題