21

I am trying to pass a rails array to a javascript function. The function will then use the array values in javascript so I need to keep it an array.

Here is how I am passing my array:

"graphit([<%=@mpg_values.join(",") %>])"

This produces this in the HTML

"graphit([#&lt;Mile:0x6ff0cf0&gt;,#&lt;Mile:0x6ff0c18&gt;,#&lt;Mile:0x6ff0b58&gt;])"

Which are not the values, they should be decimal numbers. I assume this is because it is a reference to the array so that I why I am getting the messed up values. If I do something like to_s I see the values but it has other stuff like the table and filed name in there as well.

Anybody know how I can get this rails array to a javascript function as an array?

Thanks in advance for any help.

4
  • Perhaps you can simply use @mpg_values.to_json? Commented Aug 25, 2011 at 19:44
  • @Ankit Soni when I use to_json I get this [{"mile":{"mpg":"17.156136063144"}},{"mile":{"mpg":"19.06539208592"}},{"mile":{"mpg":"18.471164309032"}}] so I get the extra mile and mpg like in to_s. I suppose I can parse this out in javascript but I would think there would be a simpler method to doing this. Commented Aug 25, 2011 at 20:48
  • How about just calling @mpg_values.inspect? I think the format it returns is the same as a JS array. Commented Aug 25, 2011 at 20:51
  • @Ankit-Soni That seems to do the same thing as to_s gives me this.. [#<Mile mpg: #<BigDecimal:6ded698,'0.1715613606 3144E2',16(20)>>, Commented Aug 25, 2011 at 21:00

5 Answers 5

82

Since this still seems like an issue and nobody resolved it. Here goes

var js_array = [<%= raw @object.to_json %>];
Sign up to request clarification or add additional context in comments.

3 Comments

Thanks alot for this answer, I was looking for it all over!
In my case no need to add []. Rails will add it. So var js_array = <%= raw @object.to_json %>; is fine for me. It may help someone
That is the great solution
1

Use Ruby's collect Method.

A cleaner version of your solution, Xaxum, would be something like this:

def chart_values
  @mpg_values.collect do |mpg_value|
    [ mpg_value.date.to_s, mpg_value.mpg.round(2).to_f ]
  end
end

The collect method automatically generates an array of whatever the block results in, so you'll end up with something like this:

[ 
  [2011-05-20, 18.56], 
  [2011-06-01, 18.47]
]

I also changed the mpg value to use to_f, which provide a number instead of a string.

Comments

0

Going to JSON as suggested a couple times in this post always gave me something like this.

[{"mile":{"date":"2011-05-20","mpg":"18.565887006952"}},{"mile":{"date":"2011-06-01","mpg":"18.471164309032"}}]

What I really wanted was just this... [[2011-05-20, 18.56][2011-06-01, 18.47]]

So I handled it with a helper like so.

  def chart_values()
    @chart_values = '['
    @mpg_values.each do |m|
      @chart_values = @chart_values+'['+m.date.to_s+', '+m.mpg.round(2).to_s+'],'
    end
    @chart_values = @chart_values+']'
  end

Then passed chart_values() to the javascript.

Likely not the best solution but it gave me the desired values in the format I needed.

1 Comment

I needed to return a specific array as JSON as well. I refactored your method and posted an answer to help others.
0

If you're using HAML, you can just do this:

var js_array = #{object};

Comments

0

bokor's answer works, but causes some linter and IDE errors if you want the array to be saved to a const, instead of a var / let.

The following variation seems to work and be compliant with the linters and IDEs that I am using.

const js_array = JSON.parse('<%= raw @object %>');

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.