Внедрение значений переменных в JavaScript и HAML в RoR - PullRequest
52 голосов
/ 17 января 2011

У меня есть следующая функция для использования ZenDesk.Я хотел бы добавить мои данные current_user в форму следующим образом.(это мой из шаблона html.haml).Однако я не могу понять, как заставить это работать.

:javascript
    if (typeof(Zenbox) !== "undefined") {
      Zenbox.init({
        dropboxID:   "xxxxx",
        url:         "xxxxx.zendesk.com",
        tabID:       "support",
        tabColor:    "black",
        tabPosition: "Left",
        requester_name:  =current_user ? "#{current_user.first_name} #{current_user.last_name}" : "" ,
        requester_email: =current_user ? "#{current_user.email}" : "" ,
        hide_tab: true
        });
    }

Короче говоря, как можно внедрить переменные rails в элемент: javascript в haml.

Ответы [ 2 ]

64 голосов
/ 17 января 2011

Это должно работать т.е.поместите весь встроенный рубин в #{}:

requester_name:  "#{current_user.first_name + ' ' + current_user.last_name if current_user}",
requester_email: "#{current_user.email if current_user}",
27 голосов

Direct #{} работает для простых строк, но не является наиболее масштабируемым / безопасным решением в целом.

Например, обратная косая черта в Ruby может вызвать проблемы в Javascript, где она будет интерпретироваться каксимвол новой строки:

- a = "\\n"
:javascript
  '#{ a }' !== "\\n"

Начиная с этого удивительного набора Rails , можно использовать следующие приемы:

escape_javascript

Псевдоним: j.

Работает только со строками.

Экранирует символы, которые могут иметь особое значение в строках Javascript, например экранирование обратной косой черты, в формат, подходящий для размещения внутри строковых кавычек строки JavaScript.

Поддерживать html_safe состояние ввода, поэтому необходимо html_safe, иначе специальные HTML-символы, такие как <, будут экранированы в &lt;.

- a = "\\n<"
:javascript
  '#{ j(a)           }' === '\\n&lt;'
  '#{ j(a).html_safe }' === '\\n<'

to_json +html_safe

Работает, потому что JSON является почти подмножеством буквенной нотации объекта Javascript .

Работает с любым хеш-объектом, включая строки, массивы и целые числа, которыепреобразуются в JSON-фрагменты соответствующего типа данных.

- data = { key1: 'val1', key2: 'val2' }
:javascript
  data = #{ data.to_json }
  data.key1 === 'val1'
  data.key2 === 'val2'

data-attribute

Добавление значений к атрибутам, извлечение их с помощью операций Javascript DOM.

Лучше с помощником content_tag:

= content_tag 'div', '', id: 'data', data: {key1: 'val1', key2: 'val2'}
:javascript
  $('#data').data('key1') === 'val1'
  $('#data').data('key2') === 'val2'

Гон

Библиотека, специализированная для работы: https://github.com/gazay/gon

Вероятно,самое надежное решение.

Gemfile:

gem 'gon'

Контроллер:

gon.key1 = 'val1'
gon.key2 = 'val2'

Макет app/views/layouts/application.html.erb:

<html>
<head>
  <meta charset="utf-8"/>
  <%= include_gon %>

Вид:

:javascript
  gon.key1 === 'val1'
  gon.key2 === 'val2'
...