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

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

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

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

JavaScript

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

Ajax

Ajaxとは、Webブラウザ内で搭載されているJavaScriptのHTTP通信機能を使って非同期通信を利用し、インターフェイスの構築などを行う技術の総称です。XMLドキュメントを指定したURLから読み込み、画面描画やユーザの操作などと並行してサーバと非同期に通信するWebアプリケーションを実現することができます。

Q&A

0回答

1395閲覧

Rails4 google map 連携

退会済みユーザー

退会済みユーザー

総合スコア0

Ruby on Rails

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

JavaScript

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

Ajax

Ajaxとは、Webブラウザ内で搭載されているJavaScriptのHTTP通信機能を使って非同期通信を利用し、インターフェイスの構築などを行う技術の総称です。XMLドキュメントを指定したURLから読み込み、画面描画やユーザの操作などと並行してサーバと非同期に通信するWebアプリケーションを実現することができます。

0グッド

1クリップ

投稿2016/07/30 13:13

編集2016/07/31 04:20

参考サイトを見ながらgoogle map連携を試みているのですが、自分のプロジェクトに実装したところajaxが着火しません

具体的には都道府県を入力しsarchボタンを押しても何も起こりません、単体のプロジェクトを新規で作り実装した場合は全て動きました。

既存のプロジェクトの違いはチューブリンクスをの可否で、既存のプロジェクトはチューブリンクスを使っていません、これは関係ありますでしょうか?

値はしっかり入っているのですがmapが下記のように表示されてしまいます。
イメージ説明

ruby

1<%= form_for(@place) do |f| %> 2 <div class="field"> 3 <%= f.label :name %><br> 4 <%= f.text_field :name %> 5 </div> 6 <div class="field"> 7 <%= f.label :address %><br> 8 <%= f.text_field :address, class: "address" %> 9------------------------------------------------------------------------------------------ 10 <%= link_to "SEARCH", "#", class: "map-search-button" %> 11 <div class="map-canvas" style="height: 0;" 12 data-lat="<%= f.object.latitude %>" 13 data-lng="<%= f.object.longitude %>"> 14 15 </div> 16 <%= f.text_field :latitude, readonly: true %> 17 <%= f.text_field :longitude,readonly: true %> 18------------------------------------------------------------------------------------------ 19 </div> 20<% end %>

javascript

1ready = -> 2 3 if !window.google 4 5 script = document.createElement('script') 6 script.type = 'text/javascript'; 7 script.src = 'https://maps.googleapis.com/maps/api/js?v=3.exp&' + 8 'language=ja&callback=triggerMap' 9 document.body.appendChild(script) 10 11 else 12 triggerMap() 13 14window.triggerMap = -> 15 # your code 16 17# For turbolinks 18$(document).ready(ready) 19$(document).on 'page:load', ready 20 21window.triggerMap = -> 22 23 # --- show --- # 24 mapCanvas = $('.map-show-canvas') 25 if mapCanvas.length && mapCanvas.attr('data-latitude') 26 27 MapHelper.showMap(mapCanvas.get(0), 28 { 29 mapHeight: 300, 30 mapLat: mapCanvas.attr('data-latitude'), 31 mapLng: mapCanvas.attr('data-longitude'), 32 zoom: 10 33 #scaleControl: , 34 #scrollwheel: , 35 #showMarker: , 36 #draggable: , 37 } 38 ) 39 40 41window.triggerMap = -> 42 43 # --- new/edit --- # 44 if $('.map-search-button').length 45 46 MapHelper.searchShowMap($('.map-canvas').get(0), 47 { 48 mapHeight: 300, 49 trigger: $('.map-search-button'), 50 addressInput: $('.address'), #could be multiple 51 latInput: $('#place_latitude'), 52 lngInput: $('#place_longitude'), 53 zoom: 10 54 #scaleControl: , 55 #scrollwheel: , 56 #showMarker: , 57 #draggable: , 58 afterShow: -> 59 console.log "Map is displayed." 60 } 61 ) 62 63 64 # --- index --- # 65 if $('.map-index').length 66 $.ajax( 67 type: 'GET', 68 url: '/places.json', 69 # data: { if you need } 70 ).done( (data) -> 71 if data.length 72 MapHelper.showMapWithMarkers($('.map-index').get(0), 73 { 74 mapHeight: 400, 75 mapLat: data[0].latitude, #center 76 mapLng: data[0].longitude, #center 77 zoom: 2, 78 showMarker: false, 79 draggable: false, 80 controller: 'places', 81 titleField: 'name' 82 }, data) 83 ) 84 85 86

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

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

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

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

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

kei344

2016/07/30 17:42

具体的に出力されたJavaScriptを質問文に追記いただいたほうが回答を得られやすいと思います。
退会済みユーザー

退会済みユーザー

2016/07/30 18:47

出力されたjsはどうやったら確認できるでしょうか?
kei344

2016/07/30 18:51

ブラウザで「ページのソースを表示」を使って、当該JavaScriptを見れませんか?
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

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

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

アカウントをお持ちの方は

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

ただいまの回答率
85.48%

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

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

質問する

関連した質問