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

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

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

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

Ruby

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

Ruby on Rails

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

jQuery

jQueryは、JavaScriptライブラリのひとつです。 簡単な記述で、JavaScriptコードを実行できるように設計されています。 2006年1月に、ジョン・レシグが発表しました。 jQueryは独特の記述法を用いており、機能のほとんどは「$関数」や「jQueryオブジェクト」のメソッドとして定義されています。

Q&A

解決済

2回答

4666閲覧

Railsでコントローラからjqueryに変数を渡したい

Kochan

総合スコア56

Ruby on Rails 5

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

Ruby

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

Ruby on Rails

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

jQuery

jQueryは、JavaScriptライブラリのひとつです。 簡単な記述で、JavaScriptコードを実行できるように設計されています。 2006年1月に、ジョン・レシグが発表しました。 jQueryは独特の記述法を用いており、機能のほとんどは「$関数」や「jQueryオブジェクト」のメソッドとして定義されています。

0グッド

0クリップ

投稿2018/06/27 16:30

前提・実現したいこと

フォームにURLを入力 > ボタンを押す > タイトルを取得 > フォームに自動入力
という機能を作ろうとしています。

発生している問題・エラーメッセージ

コントローラ内に新しいメソッドを作って、
そこに向かってURL情報を送り、スクレイピングでタイトルを取得するところまで上手くいっているのはbinding.pryで変数をみて確認しています。

そこからインスタンス変数に入れた変数を
jqueryに戻して、ひとまずalert表示したいと考えているのですが、
そのさきのjs.erbファイルが動きません。

単純なalert('aaa');という文も動かないので何か問題があるのだと思います。

chrome拡張機能のRailsタブにて確認したところ、
狙ったjsファイルがrenderingはされているように思えます。

何か、ヒントや先への進み方、問題点がわかればご指摘お願いします。

該当のソースコード

以下のインプットフォームにURLを入力、
#novel-infoボタンを押すとajaxが動きます。

haml

1//---show.html.haml--- 2.button.btn.btn-primary#novel-info 3 button 4%input#novel-url

ここでajaxにて、
matomes_controllerのscraping_novel_titleアクションに飛ばしています。

javascript

1//---application.js--- 2$(document).on('turbolinks:load',function(){ 3 4 $("#novel-info").click(function(){ 5 $.ajax({ 6 url: "scraping_novel_title", 7 type: "GET", 8 data: { url : $("#novel-url").val() 9 }, 10 dataType: "html", 11 success: function(data) { 12 // alert("success"); 13 console.log('success'); 14 }, 15 error: function(data) { 16 // alert("errror"); 17 console.log('error'); 18 } 19 }); 20 }); 21}); 22

コントローラ内でスクレイピングしてデータを取得、インスタンス変数に格納しています。
それをjavascriptに渡すよう実装しているつもりです。

ruby

1#app/controllers/matomes_controller.rb 2 def scraping_novel_title 3 agent = Mechanize.new 4 page = agent.get(params[:url]) 5 @novel_title = page.at('.novel_title').inner_text 6 7 respond_to do |format| 8 format.js 9 end 10 end 11

以下のjavascriptファイルが呼ばれるかを試すために、
単純なalertを入れましたが動きませんでした。

javascript

1//app/views/matomes/scraping_novel_title.js.erb 2alert('aaaa');

画像を見る限り、狙ったjsファイルが読み込まれているように思えます。
ajaxのレスポンスもサクセスとなっています。
イメージ説明

何か、アドバイス、わかることがありましたらぜひご教示お願いいたします。

補足情報(FW/ツールのバージョンなど)

Rails5

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

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

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

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

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

guest

回答2

0

自己解決

jsのsuccess(data)のdataの部分に、
erbで書いたものが入ってきていたので
erb内で変数展開、jsでjqueryを呼んで処理
という流れで実装できました!

erb

1<%= @novel_title %>delimiter<%= @novel_description %>

javascript

1 success: function(data) { 2 console.log('success'); 3 console.log(data); 4 // app/views/matomes/scraping_novel.js.erb 5 //上記ファイルの中身を文字列"delimiter"で分ける 6 var split_datas = data.split("delimiter"); 7 $("#modal-novel-title").val(split_datas[0]); 8 $("#modal-novel-description").val(split_datas[1]); 9 },

詳しくはこちらをどうぞ。
https://qiita.com/Kohei_Kishimoto0214/items/d32c59784a995798ba02

投稿2018/06/28 12:03

Kochan

総合スコア56

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

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

0

当てずっぽうですが、Railsのメソッドを以下のように変えてみたり

respond_to do |format| format.js { render layout: false, content_type: 'text/javascript' } end

JSのコードを以下のように変えてみたり

$(function(){ alert('aaaa'); });

投稿2018/06/27 18:10

kthatoto

総合スコア49

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

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

Kochan

2018/06/28 12:03

回答ありがとうございました! 自己解決できました!
kthatoto

2018/06/29 05:43

お役に立てず申し訳ないですが、よかったです!
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

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

ただいまの回答率
85.48%

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

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

質問する

関連した質問