Passing JSON data from Controller to JavaScript

Question

There is a service that when I hit it it return me JSON like this, so I think it is returning me the correct JSON I need:

enter image description here

Now in my client contoller I have something simple as this to call the Service and get the JSON back and if I put break points I can see that yes it does have the same JSON posted above

class PharmacyController < ApplicationController
  def index
    @order_summary = client.get_order_summary(10)

    gon.data = @order_summary # my attempt to pass it with GON gem.
  end
end

and then in my pharmacy/index.html.erb I am calling my Javascript:

<%= javascript_include_tag 'dummy.js' %>

and my dummy.js javascript file looks like this for now, just to make sure I can see the same number of elements no the array:

$( document ).ready(function() {
    var data = gon.data;
    console.log( data.length);
});

but what it returns is "undefined"

Do you have any other suggestions for how to achieve this?

Instead of vanilla javascript or jquery as noted in an answer below, consider using AngularJS or EmberJS. Also if your Rails controller really isn't helping that much, you could just call the service directly from Javascript (AngularJS, EmberJS, etc.) vs. having to hit the controller just to hit the other service, only if you can do that securely, of course. — Gary S. Weaver
– Gary S. Weaver, Commented May 21, 2013 at 17:07

Faishal · Accepted Answer · 2013-05-21 15:59:41Z

1

Use jQuery Ajax

$.ajax({
        url: <url>,
        type: 'get',
        data: {},
        success: function (data) {
            console.log( data);
        }
    });

answered May 21, 2013 at 15:59

Faishal

1,4931 gold badge14 silver badges23 bronze badges

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

2 Comments

user1899082 Over a year ago

Thanks, is there some weird semicolons missing? That's what I have so far:"$( document ).ready(function() { $.ajax({ url: <url>, type: 'get', data: {}, success: function (data) { console.log(data); }; }); });"

Faishal Over a year ago

$(document).ready(function() { $.ajax({ url: <url > , type: 'get', data: {}, success: function(data) { console.log(data); } }); });

user1899082 · Accepted Answer · 2013-05-21 18:40:58Z

0

I just should have done:

gon.data.body

.body was missing.

answered May 21, 2013 at 18:40

user1899082

Collectives™ on Stack Overflow

Passing JSON data from Controller to JavaScript

2 Answers 2

2 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related