BackEnd

RailsでERBからJavaScriptにhashを渡す方法

投稿日:

はじめに

以前、選択したプルダウンメニューに応じて別のプルダウンメニューの内容を動的に書き換えたいケースがありました。

その際、カスタムデータ属性を利用してERBファイルからJavaScrptにhashを渡してプルダウンメニューを更新しました。

今回はカスタムデータ属性を利用してコントローラで生成したhashをJavaScriptに渡す方法を記載します。

 

カスタムデータ属性とは

data-で始まる任意の名前のデータ属性を定義して使うことができます。
ただし、格納するデータは文字列でなくてはなりません。
カスタムデータ属性について

 

実装例

コントローラの実装

コントローラ側ではJavaScriptに渡したいhashを生成します。

ビューの実装

ビュー側ではコントローラ側で生成したhashをカスタムデータ属性に格納します。

格納したデータはJQueryのdata()で取得します。
(JavaScriptでも取得できますが、Object型にするためにはJSON.parse()を使う必要があります)

実行結果

実際に取得できたかどうかコンソールで確認してみます。

 

さいごに

カスタムデータ属性を利用してコントローラで生成したhashをJavaScriptに渡す方法を記載しました。

blog-page_footer_336




blog-page_footer_336




-BackEnd

執筆者:


comment

メールアドレスが公開されることはありません。

CAPTCHA


関連記事

rails

【Puma】アプリサーバのチューニング

1 はじめに2 チューニングで注意する項目3 子プロセスの数3.1 最低3つの子プロセスを割り当てる3.2 最大子プロセス数3.3 CPUコア数と子プロセス数3.4 なぜPumaの子プロセス数を増やす ...

php logo

PHP入門 〜文字列と数値の操作〜

1 はじめに2 基本ルール2.1 開始と終了のタグ2.2 ホワイトスペース2.3 大文字と小文字の区別2.4 コメント2.5 変数の定義3 文字列の操作3.1 文字列の定義3.2 無駄なスペースを削除 ...

rails

Rails Developer Meetup に参加してきました【2日目】

1 はじめに2 Rails Developer Meetup3 テストのないレガシーなRailsアプリをリファクタした話3.1 なぜリファクタリングしたのか3.2 コードを3種類に分類する3.3 モデ ...

【Git】マージコミットを消したい

1 はじめに2 例えばこんなことってないでしょうか?3 マージコミットを消す4 さいごに はじめに こんにちは、tonnyです。 今回はGitのケーススタディ的なものを書きたいと思います。 反面教師と ...

Go言語

Go言語 gocraft/workを使って常駐プロセスでジョブを処理させる

1 はじめに2 workの特徴3 workを使えるようにする3.1 Redisのインストール3.2 Go用のライブラリインストール4 Enqueue〜ジョブ実行まで4.1 Enqueue側4.2 ジョ ...

フォロー

follow us in feedly

blog-page_side_responsive

東京改造計画(NewsPicks Book)
2017年8月
 12345
6789101112
13141516171819
20212223242526
2728293031 

アプリ情報

私たちは無料アプリもリリースしています、ぜひご覧ください。 下記のアイコンから無料でダウンロードできます。