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

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

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

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

HTML5

HTML5 (Hyper Text Markup Language、バージョン 5)は、マークアップ言語であるHTMLの第5版です。

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

解決済

Rails5で作成したHTMLのselect要素に属性(id)を指定する方法について教えてください。

koume
koume

総合スコア0

Ruby on Rails 5

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

HTML5

HTML5 (Hyper Text Markup Language、バージョン 5)は、マークアップ言語であるHTMLの第5版です。

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

1回答

0評価

0クリップ

647閲覧

投稿2019/07/01 02:25

Rails5でアプリケーションを作成しています。(参考書に基づいて作成中です。)
フォームのドロップダウンリストの入力値を取得したくてJavaScriptのことを学習しています。
そこで、select要素の参照をしたいのですがこのやり方を教えて欲しいのです。

現在、以下のようなメソッドでドロップダウンリストが表示出来ています。(都道府県の表示)

models/request.rb PREFECTURE_NAMES = %w( 北海道 青森県 岩手県 宮城県 秋田県 山形県 福島県 茨城県 栃木県 群馬県 埼玉県 千葉県 東京都 神奈川県 新潟県 富山県 石川県 福井県 山梨県 長野県 岐阜県 静岡県 愛知県 三重県 滋賀県 京都府 大阪府 兵庫県 奈良県 和歌山県 鳥取県 島根県 岡山県 広島県 山口県 徳島県 香川県 愛媛県 高知県 福岡県 佐賀県 長崎県 熊本県 大分県 宮崎県 鹿児島県 沖縄県 )
ClientFormPresenter.rb class FormPresenter include HtmlBuilder attr_reader :form_builder, :view_context delegate :label, :text_field, :password_field, :check_box, :radio_button, :text_area, :object, to: :form_builder def drop_down_list_block(name, label_text, choices, options = {}) markup(:div, class: 'input-block') do |m| m << decorated_label(name, label_text, options) m << form_builder.select(name, choices, { include_blank: true }, options) m << error_messages_for(name) end end
_form.html.erb <%= markup do |m| p = ClientFormPresenter.new(f, self) m << p.notes p.with_options(required: true) do |q| m << q.drop_down_list_block(:prefecture, '都道府県', Request::PREFECTURE_NAMES) end end %>

ドロップダウンメニューの情報を取得したいのですが、本や、サイトでは以下のようにしていました。

(例) HTML <select id="mySelect"> <option value="apple">apple</option> <option value="orange">orange</option> <option value="grape" selected>grape</option> </select> JavaScript const element = document.querySelector('#mySelect'); const value = element.value;

markup(:div, class: 'input-block') do |m| と
m << form_builder.select(name, choices, { include_blank: true }, options) の
2行でドロップダウンリストが生成されていろと思いますが、そのselect要素にid属性を指定するにはどうすればいいのでしょうか?

<select id="mySelect"> このような感じで属性を指定し、あとでjavaScriptで入力値を取得したいのです。
javaScriptで初めて値を取得し、いろいろとやりたいことができたので学習をし、サイトや参考書の基本的なやり方はだいたい理解出来ましたが、自分のコードではselect要素に属性を指定出来ていないと思うのです。
このコードで(自分のコード)select要素にid属性を指定する方法をご教授お願いします。
javaScript初心者で質問の内容がうまく伝えることができているかも疑問ですが、宜しくお願いします。

良い質問の評価を上げる

以下のような質問は評価を上げましょう

  • 質問内容が明確
  • 自分も答えを知りたい
  • 質問者以外のユーザにも役立つ

評価が高い質問は、TOPページの「注目」タブのフィードに表示されやすくなります。

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

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

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

teratailでは下記のような質問を「具体的に困っていることがない質問」、「サイトポリシーに違反する質問」と定義し、推奨していません。

  • プログラミングに関係のない質問
  • やってほしいことだけを記載した丸投げの質問
  • 問題・課題が含まれていない質問
  • 意図的に内容が抹消された質問
  • 過去に投稿した質問と同じ内容の質問
  • 広告と受け取られるような投稿

評価を下げると、トップページの「アクティブ」「注目」タブのフィードに表示されにくくなります。

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

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

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

ただいまの回答率
87.20%

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

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

質問する

関連した質問

同じタグがついた質問を見る

Ruby on Rails 5

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

HTML5

HTML5 (Hyper Text Markup Language、バージョン 5)は、マークアップ言語であるHTMLの第5版です。

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。