Ruby on RailsでJSONをオブジェクトのままJavaScriptに渡す方法

やりたいこと

Ajaxの非同期通信により取得したJSONデータをオブジェクトのままViewのJavaScriptに渡したい。

方法

rawメソッドを使用する。
  • ControllerにてDBから取得したデータを変数に格納。
$ vi app/controllers/chapters_controller.rb

  def tweets
    @tweets = Tweet.find_all_by_chapter_id(params[:id])
  end
  • Ajax用のerbファイルにて、Controllerで取得したデータをrawメソッドを使用してJavaScriptの変数にJSONオブジェクトとして渡す。
$ vi app/views/chapters/tweets.js.erb

window.tweets = <%= raw @tweets.to_json %>;
  • View側で取得したJSONオブジェクトからデータを参照
    • 一時的にerb内に書いてしまっているが、本来はJavaScriptファイルに外出しするべき。
    • なお、Ajaxで取得したレスポンスデータをコールバック関数外で使うには、グローバル変数に格納するしか方法は無い。
$ vi app/views/chapters/show.html.erb

<script>
  window.tweets = null;

  $('#show_tweets').click(function(){
    alert(window.tweets.length);
    alert(window.tweets);
    alert(window.tweets[0].text);
  });
</script>

参考サイト