Передача параметров в / из JavaScript & Rails

Question

Передача параметров в / из JavaScript & Rails

В моем приложении Rails у меня есть вспомогательный метод location это возвращает координаты для данного IP-адреса и делает их доступными для всех контроллеров и представлений. Например:location.latitude возвращает широту пользователя. Вы поняли идею.

У меня также есть Javascript, который рисует карту из Google Maps API на основе заданной пары lat/lon. Проблема в том, что я понятия не имею, как сдать экзамен.location парамы в JavaScript!

JavaScript находится в применении.js' и выглядит так:

$(document).ready(function() 

  { 



    //Map options...I want the params to go into the var 'MapOptions' below



    function initialize() {

      var mapOptions = {

        center: new google.maps.LatLng(40.764698,-73.978972),

        zoom: 13,

        mapTypeId: google.maps.MapTypeId.ROADMAP

        };



    //Setup and Draw the Map...

    //....................................

  };

Сама карта вызывается в HTML примерно так. Нет очевидного способа пройти парамы.

<div id="map_canvas">

  <!-- The Map gets drawn here! -->

</div>

Я знаю, что это, вероятно, очевидный вопрос, но мне никогда раньше не приходилось передавать параметр из моего приложения в Javascript таким образом.

618 4

javascript ruby-on-rails google-maps

4 ответов:

Comments

Ничего не найдено.

Joe Steele · Accepted Answer · 2011-11-25 19:40:52

Я думаю, что атрибуты данных здесь хорошо работают.

Html

<div id="map_canvas" data-latitude="40.764698" data-longitude="-73.978972">
  <!-- The Map gets drawn here! -->
</div>

Или с вашими помощниками

<div id="map_canvas" data-latitude="<%= location.latitude %>" data-longitude="<%= location.longitude %>">
  <!-- The Map gets drawn here! -->
</div>

Js

$(document).ready(function() { 

  //Map options...I want the params to go into the var 'MapOptions' below

  function initialize() {
    var mapDiv = $('#map_canvas');
    var lat = mapDiv.data('latitude'),
        lng = mapDiv.data('longitude');

    var mapOptions = {
      center: new google.maps.LatLng(lat,lng),
      zoom: 13,
      mapTypeId: google.maps.MapTypeId.ROADMAP
    };

  //Setup and Draw the Map...
  //....................................
};

Mikhail Nikalyukin · Accepted Answer · 2011-11-25 19:17:20

Вы можете назначить lat и long скрытым полям в представлении. И в ваших приложениях.JS script просто получить их, как $("#lat").val() не окончательное решение, но должно хорошо работать.

Aizzat Suhardi · Accepted Answer · 2014-01-24 11:22:10

Передача данных в javascript может быть упрощена с помощью Gon gem
Например, определите что-нибудь с помощью gon в вашем контроллере:
class FooController < ApplicationController

  def show_map
    #....
    gon.mapLatLong = [40.764698,-73.978972]
Далее выведите этот тег erb в своем представлении
<%= include_gon %>
Значенияgon , определенные в этом контроллере, будут изменены в переменные javascript в ваших представлениях. Таким образом, вы можете написать это так в своем javascript
center: new google.maps.LatLng(gon.mapLatLong[0],gon.mapLatLong[1]),
Reference:
https://github.com/gazay/gon
http://railscasts.com/episodes/324-passing-data-to-javascript

Dmitri Lihhatsov · Accepted Answer · 2015-01-10 03:41:47

Посмотрите на следующую страницу, которая объясняет, как передавать данные в JavaScript: http://railscasts.com/episodes/324-passing-data-to-javascript?view=asciicast

Короче говоря, просто используйте:
<%= javascript_tag do %>
   window.productsURL = '<%= j products_url %>';
<% end %>
А затем обратитесь к productsURL в любом месте ваших сценариев.