Rails - passing data hash from Ruby to JS via js.erb file

Question

This my controller:

      def show
        @result = {"data"=>{"8"=>{"typeA"=>{"tier"=>[1,2],"message"=>"message"},"typeB"=>"sto"}}}
        respond_to do |format|
          format.js
        end
      end

So in show.js.erb I want to be able to create a JS object data that is @result['data']. But it's really not working... The closest I can seem to get is a string representation, but then JSON.parse fails to convert it to a JS object because all the characters have been encoded:

  console.log("<%= @result['data'] %>")
  var data = JSON.parse("<%= @result['data'] %>") 
  console.log(data)

ACTUAL OUTPUT

  > {&quot;8&quot;:{&quot;typeA&quot;:{&quot;message&quot;:&quot;message&quot;,&quot;tier&quot;:[1,2]},&quot;typeB&quot;:&quot;sto&quot;}}

  > Uncaught SYntaxError: Unexpected token & in JSON at position 1

DESIRED OUTPUT (for second console.log)

  > {"8":{"typeA":{"tier":[1,2],"message":"message"},"typeB":"sto"}}

Note I tried to do @result.to_json, this didn't help

Karim Tarek · Accepted Answer · 2021-01-14 21:55:31Z

3

Unless you use the raw view helper, Rails will automatically escape tags.

This should do the trick:

  var data = <%= raw(@result.to_json) %>;
  console.log(data);
  console.log(typeof data);

edited Jan 14, 2021 at 21:55

answered Jan 14, 2021 at 21:50

Karim Tarek

9176 silver badges19 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Rastagot · Accepted Answer · 2021-01-14 20:27:53Z

0

Have you tried

@result.to_json

or j or escape_javascript helpers?

var data = JSON.parse("<%= j @result['data'] %>")

edited Jan 14, 2021 at 20:27

answered Jan 14, 2021 at 20:18

Rastagot

413 bronze badges

1 Comment

james Over a year ago

yes, unfortunately I get the same output with j

Collectives™ on Stack Overflow

Rails - passing data hash from Ruby to JS via js.erb file

2 Answers 2

Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related