web-dev-qa-db-fra.com

Injection de valeurs variables en javascript et HAML dans RoR

J'ai la fonction suivante pour utiliser ZenDesk. Je voudrais injecter mes détails current_user dans le formulaire comme suit. (ceci est mon modèle de html.haml). Cependant, je ne peux pas comprendre comment faire fonctionner cela.

: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
        });
    }

En bref, comment injecter des variables Rails dans un élément: javascript en haml).

52
Dave G

Cela devrait fonctionner ie. mettre tout en ligne Ruby à l'intérieur de #{}:

requester_name:  "#{current_user.first_name + ' ' + current_user.last_name if current_user}",
requester_email: "#{current_user.email if current_user}",
64
Heikki

Direct #{} fonctionne pour les chaînes simples, mais n'est pas la solution la plus évolutive/sûre en général.

Par exemple, la barre oblique inverse littérale dans Ruby vous causerait des problèmes en Javascript où elle sera interprétée comme un caractère de nouvelle ligne:

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

Depuis ce génial Rails cast , les techniques suivantes peuvent être utilisées:

escape_javascript

Alias: j.

Fonctionne uniquement sur les chaînes.

Échappe les caractères qui peuvent avoir des significations spéciales dans les chaînes Javascript, comme les échappements antislash, dans un format approprié pour mettre entre guillemets littéraux de chaîne Javascript.

Maintenir html_safe état de l'entrée, donc besoins html_safe sinon des caractères HTML spéciaux comme < se serait échappé dans &lt;.

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

to_json + html_safe

Fonctionne parce que JSON est presque un sous-ensemble de notation littérale d'objet Javascript .

Fonctionne sur n'importe quel objet de hachage, y compris les chaînes, les tableaux et les entiers qui sont convertis en fragments JSON du type de données correspondant.

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

attributs de données

Ajoutez des valeurs aux attributs, récupérez-les avec des opérations Javascript Javascript.

Mieux avec le content_tag assistant:

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

gon

Bibliothèque spécialisée pour le travail: https://github.com/gazay/gon

Probablement la solution la plus robuste.

Gemfile:

gem 'gon'

Manette:

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

Disposition app/views/layouts/application.html.erb:

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

Vue:

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