質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.48%
Ruby

Rubyはプログラミング言語のひとつで、オープンソース、オブジェクト指向のプログラミング開発に対応しています。

Ruby on Rails

Ruby on Railsは、オープンソースのWebアプリケーションフレームワークです。「同じことを繰り返さない」というRailsの基本理念のもと、他のフレームワークより少ないコードで簡単に開発できるよう設計されています。

Ruby on Rails 4

Ruby on Rails4はRubyによって書かれたオープンソースのウェブフレームワークです。 Ruby on Railsは「設定より規約」の原則に従っており、効率的に作業を行うために再開発を行う必要をなくしてくれます。

teratail

teratail(テラテイル)は、プログラミングに特化した日本語Q&Aサイトです。

Q&A

0回答

2317閲覧

rails4でのajaxを用いた連動プルダウン(3階層)実装について

tonoko

総合スコア8

Ruby

Rubyはプログラミング言語のひとつで、オープンソース、オブジェクト指向のプログラミング開発に対応しています。

Ruby on Rails

Ruby on Railsは、オープンソースのWebアプリケーションフレームワークです。「同じことを繰り返さない」というRailsの基本理念のもと、他のフレームワークより少ないコードで簡単に開発できるよう設計されています。

Ruby on Rails 4

Ruby on Rails4はRubyによって書かれたオープンソースのウェブフレームワークです。 Ruby on Railsは「設定より規約」の原則に従っており、効率的に作業を行うために再開発を行う必要をなくしてくれます。

teratail

teratail(テラテイル)は、プログラミングに特化した日本語Q&Aサイトです。

1グッド

0クリップ

投稿2016/04/01 20:33

編集2016/04/03 15:59

###前提・実現したいこと
rails4でajaxを使用した連動プルダウンの実装を試みているのですが、理想形が3階層のプルダウン(例として、都道府県[Prefecture]→市区町村「City」→郵便番号[Number])での記述の仕方がわかりません。

###発生している問題・エラーメッセージ
色々ググってみた結果様々なアプローチがあるようですが、現状下記のコードで2階層までの連動プルダウンが実現できており、あと一息で3階層ができそうなのですが、2階層目を選択した時点で3階層目が"3階層目が表示されるよ!"部分に表示されずそのままで、反応していないようです。特別エラーを吐いている様子はないのですが、パラメータ[params[:number_id]]が3階層目に飛んでいない(ajax処理ができていない?)ことは確認済みです。

尚、参考サイト(2階層まではこちらを参考)のソースをそのまま模写している部分があるため、不自然な点があるかもしれません。

下記ソースの内容や別アプローチを含め、このような場合のベストプラクティスをご教授いただけますと幸いです。よろしくお願いします。

###ソースコード

ruby

1#ajax_controller.rb 2class AjaxController < ApplicationController 3 def search 4 @prefectures=Prefecture.select(:prefecture_name,:id,:city_id).distinct 5 end 6 7 def result 8 @cities=City.where(prefecture_id:params[:city_id]) 9 end 10 11 def result2 12 @numbers=Number.where(city_id:params[:number_id]) 13 end 14end

html

1#search.html.erb 2 3<%= select_tag(:city_id, options_from_collection_for_select(@prefectures, :city_id, :prefecture_name),:id=>'pub',:prompt => "都道府県を選択してください", 4 data:{ 5 remote:true, 6 url:url_for(action: :result) 7 } 8)%> 9<span id="result"> 10"2階層目が表示されるよ!" 11</span> 12<span id="result2"> 13"3階層目が表示されるよ!" 14</span>

javascript

1//result.js.erb 2//2階層目のjs 3 4$(function(){ 5 $('#result').html("<%= escape_javascript(render 'search_result') %>"); 6 $('#pub').change(function(){ 7 }) 8});

ruby

1#_search_result.html.erb 2#2階層目の部分テンプレート 3<%= select_tag(:number_id,options_from_collection_for_select(@cities,:number_id,:city_name),:id=>'pub', 4 data:{ 5 remote:true, 6 url:url_for(action: :result2) 7 } 8 ) 9%>

javascript

1//result2.js.erb 2//3階層目のjs 3 4$(function(){ 5 $('#result2').html("<%= escape_javascript(render 'search_result2') %>"); 6 $('#pub').change(function(){ 7 }) 8});

ruby

1#_search_result2.html.erb 2#3階層目の部分テンプレート 3<%= select_tag(:id,options_from_collection_for_select(@numbers,:id,:number),:id=>'pub')%>

ruby

1#routes.rb 2 get 'ajax/search' 3 get 'ajax/result' 4 post '/ajax/result' 5 get 'ajax/result2' 6 post '/ajax/result2'

###補足情報(言語/FW/ツール等のバージョンなど)
ruby 2.1.3
Rails 4.2.5

ikuwow👍を押しています

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

まだ回答がついていません

会員登録して回答してみよう

アカウントをお持ちの方は

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.48%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問