<概要>
ruby on rails で動的に変わるselect boxを作成したいと考えております。具体的には、都道府県選択をすると→その県名の対象場所が選択できるというものです。
調べたところ、html上では以下を参考にしてhhtmlを実装すると、できる事がわかりました。
ですがこの記述ではコード量が多くなってしまうため、railsのenumを利用しこれを作成する方法を考えましたが、わかりません。
html
1<select class="parent" name="foo"> 2 <option value="" selected="selected">地方を選択</option> 3 <option value="北海道・東北">北海道・東北</option> 4 <option value="関東">関東</option> 5 <option value="甲信越・北陸">甲信越・北陸</option> 6 <option value="東海">東海</option> 7 <option value="関西">関西</option> 8 <option value="中国">中国</option> 9 <option value="四国">四国</option> 10 <option value="九州・沖縄">九州・沖縄</option> 11</select> 12 13<select class="children" name="bar" disabled> 14 <option value="" selected="selected">都道府県を選択</option> 15 <option value="北海道" data-val="北海道・東北">北海道</option> 16 <option value="青森県" data-val="北海道・東北">青森県</option> 17 <option value="岩手県" data-val="北海道・東北">岩手県</option> 18 <option value="宮城県" data-val="北海道・東北">宮城県</option> 19 <option value="秋田県" data-val="北海道・東北">秋田県</option> 20 <option value="山形県" data-val="北海道・東北">山形県</option> 21 <option value="福島県" data-val="北海道・東北">福島県</option> 22 <option value="茨城県" data-val="関東">茨城県</option> 23 <option value="栃木県" data-val="関東">栃木県</option> 24 <option value="群馬県" data-val="関東">群馬県</option> 25 <option value="埼玉県" data-val="関東">埼玉県</option> 26 <option value="千葉県" data-val="関東">千葉県</option> 27 <option value="東京都" data-val="関東">東京都</option> 28 <option value="神奈川県" data-val="関東">神奈川県</option> 29 <option value="新潟県" data-val="甲信越・北陸">新潟県</option> 30 <option value="富山県" data-val="甲信越・北陸">富山県</option> 31 <option value="石川県" data-val="甲信越・北陸">石川県</option> 32 <option value="福井県" data-val="甲信越・北陸">福井県</option> 33 <option value="山梨県" data-val="甲信越・北陸">山梨県</option> 34 <option value="長野県" data-val="甲信越・北陸">長野県</option> 35 <option value="岐阜県" data-val="東海">岐阜県</option> 36 <option value="静岡県" data-val="東海">静岡県</option> 37 <option value="愛知県" data-val="東海">愛知県</option> 38 <option value="三重県" data-val="東海">三重県</option> 39 <option value="滋賀県" data-val="関西">滋賀県</option> 40 <option value="京都府" data-val="関西">京都府</option> 41 <option value="大阪府" data-val="関西">大阪府</option> 42 <option value="兵庫県" data-val="関西">兵庫県</option> 43 <option value="奈良県" data-val="関西">奈良県</option> 44 <option value="和歌山県" data-val="関西">和歌山県</option> 45 <option value="鳥取県" data-val="中国">鳥取県</option> 46 <option value="島根県" data-val="中国">島根県</option> 47 <option value="岡山県" data-val="中国">岡山県</option> 48 <option value="広島県" data-val="中国">広島県</option> 49 <option value="山口県" data-val="中国">山口県</option> 50 <option value="徳島県" data-val="四国">徳島県</option> 51 <option value="香川県" data-val="四国">香川県</option> 52 <option value="愛媛県" data-val="四国">愛媛県</option> 53 <option value="高知県" data-val="四国">高知県</option> 54 <option value="福岡県" data-val="九州・沖縄">福岡県</option> 55 <option value="佐賀県" data-val="九州・沖縄">佐賀県</option> 56 <option value="長崎県" data-val="九州・沖縄">長崎県</option> 57 <option value="熊本県" data-val="九州・沖縄">熊本県</option> 58 <option value="大分県" data-val="九州・沖縄">大分県</option> 59 <option value="宮崎県" data-val="九州・沖縄">宮崎県</option> 60 <option value="鹿児島県" data-val="九州・沖縄">鹿児島県</option> 61 <option value="沖縄県" data-val="九州・沖縄">沖縄県</option> 62</select>
<わからない点>
以下のモデルのget_statusのそれぞれの値にprefectureの値のdataを持たせる事ができればenumを利用した動的select box の実装ができると思いました。もしくは、enumのよるselect boxのhtml序は一番下のように実装しております。そこでのデータを持たせる書き方がありますでしょうか?
色々調べて試してみましたが、systaxエラーになってしまいます。
dataの持たせ方がわかりません。そこをわかる方いましたら教えていただきたいです。
model
1enum prefecture: {県名を選択: "", 北海道: 0,千葉: 1,東京: 2,大阪: 3,福岡: 4,沖縄: 5} 2enum get_status: {選択してください: "", 羽田空港第1ターミナル2F: 0, 羽田空港第2ターミナル2F: 1, 羽田空港第3ターミナル2F: 2, 関西国際空港第1ターミナルビル1F: 3, 関西国際空港第2ターミナル1F: 4 ,函館空港: 5,那覇空港: 6,成田空港:7,福岡空港: 8} 3
html
1<%= f.select :prefecture, Order.prefectures.keys.to_a, {},id: "prefecture" %> 2<%= f.select :get_status, Order.get_statuses.keys.to_a, {},id: "get_status" %>
あなたの回答
tips
プレビュー