How to embed dynamic Ruby code to "javascript" section in Slim templates?

Question

One way:

javascript_tag do
  == "var all_product_ids = #{existing_ids.to_json};"
  == "var products_json   = #{@filter.data.to_json};"

or:

= %Q{
var all_product_ids = #{existing_ids.to_json};
var products_json   = #{@filter.data.to_json};
}

are there any better solutions for this?

score 84 · Answer 1 · answered Jul 24 '11 at 22:38

84

In Slim

javascript:
  var all_product_ids = "#{existing_ids.to_json}";
  var products_json   = "#{@filter.data.to_json}";

answered Jul 24 '11 at 22:38

stonean

1,218
1
9
7

score 21 · Answer 2 · answered Nov 29 '12 at 07:16

21

javascript:
  var all_product_ids = #{raw existing_ids.to_json};
  var products_json   = #{raw @filter.data.to_json};

answered Nov 29 '12 at 07:16

lidaobing

1,005
13
26

2

be careful about the `` attack – lidaobing Jun 14 '13 at 03:18
1

check Rails api for method `sanitize` – draw Jan 28 '14 at 04:22

score 18 · Answer 3 · answered Oct 28 '13 at 07:47

18

From https://github.com/slim-template/slim Text Interpolation paragraph

SLIM escapes HTML by default. To avoid the same use #{{content}} for #{content}

answered Oct 28 '13 at 07:47

Karthik M

181
1
2

score 10 · Accepted Answer · answered Apr 13 '11 at 08:38

10

what i prefer to do, is to keep all the javascript in a separate file.

for example, i would do it as follows(jquery):

in your layout:

...

<body data-product-ids="<%= existing_ids.to_json %>"
      data-products-json="<%= @filter.data.to_json %>">

.. in js:

// create your application namespace
$.myapp = {};
$.myapp.allProductIds = $.parseJSON( $('body').attr('data-product-ids') );
$.myapp.products = $.parseJSON( $('body').attr('data-products-json') );

so, you'll then use it in js like so:

$.myapp.allProductIds

answered Apr 13 '11 at 08:38

Vlad Khomich

5,820
1
27
39

1

Thank you! But when you only need one or two lines js code, will you still use a separate file? – wkang Apr 16 '11 at 12:10
2

Well, yes, it's just for a "best practices" matter. But still, that makes your code more solid and better structed – Vlad Khomich Apr 18 '11 at 05:30
2

Why this is the accepted answer when this is an ERB/jQuery answer to a specific slim/javascript question... – Matthew Jul 01 '19 at 16:40

score 3 · Answer 5 · answered Feb 07 '13 at 08:27

I had a similar problem with this. Using the code that others have provided didn't work for me because slim was html escaping my variable. I ended up using Gon. This one is for Sinatra, but they have a gem for Rails as well. Hope it helps others having similar problems.

score 3 · Answer 6 · answered Feb 14 '15 at 02:45

3

create a _your_erb_file_contain_javascript_code.erb first

And then in your slim file javascript: part:

#{ conditions ? (render 'your_erb_file_contain_javascript_code') : nil}

answered Feb 14 '15 at 02:45

Lane

4,682
1
36
20

score 2 · Answer 7 · edited Aug 05 '15 at 10:24

2

javascript:
  var isAdmin = "#{current_user.admin? ? 1 : 0}";

edited Aug 05 '15 at 10:24

MZaragoza

10,108
9
71
116

answered Aug 05 '15 at 10:06

Lane

4,682
1
36
20

How to embed dynamic Ruby code to "javascript" section in Slim templates?

7 Answers7

Linked