AJAX to fetch model data from view

Question

I get [object Object] when printing the results of my AJAX calls. Please help me find which part I'm not doing right.

The Event model has columns name, description. Am I correct to expect this kind of output?

{ "1" =>
  {
    "name" => "some name",
    "description" => "some description"
  }
}

View:

function testAJAX() {
  var test_url = "#{foo_events_path}";
  $.ajax({
    type: "GET",
    url: test_url,
    data: {
      event_id: 1
    },
    success:function(data) {
      var response = JSON.parse(JSON.stringify(data));
      alert(response.events);
    }
  });

events_controller.rb

def foo
  @events = Event.where(id: params[:event_id])
  render json: { events: @events }.to_json
end

routes.rb

resources :events do
  collection do
    get 'foo'
  end
end

I tried googling but most of them uses AJAX for php. This is the closest I could find related to my question: Is it possible to refresh partial frequently using Ajax?

I just realized, maybe the title should be "AJAX to fetch database records from view". my bad — reiallenramos, Jan 31 '18 at 00:33
Why are you doing `JSON.parse(JSON.stringify(data))`? You may be receiving an array of json objects as a string, in which case just do the `JSON.parse(data)` bit. You can always do `console.log(typeof(data))` to see what type of data you are getting. — jvillian, Jan 31 '18 at 00:40
@jvillian okay so I removed the JSON.stringify() part then logged to the console. Now it says I have an error `JSON.parse: unexpected character at line 1 column 2 of the JSON data` so I'm guessing this means I have bad syntax in the controller method? — reiallenramos, Jan 31 '18 at 00:51
Well, actually, you're returning a hash, so you shouldn't have to do anything because a hash should be converted into a proper js object. And, yes, I'm guessing your `to_json` is incorrect. (Oh, I missed @SebastianPalma commenting. You may now safely ignore me.) — jvillian, Jan 31 '18 at 00:54
@SebastianPalma still the same error `JSON.parse: unexpected character at line 1 column 2 of the JSON data` — reiallenramos, Jan 31 '18 at 00:55
Remove `to_json` *and* don't do `JSON.parse`. See if your `data` object is valid. — jvillian, Jan 31 '18 at 00:57
@jvillian after removing `to_json` and using only this in the ajax call: `success:function(data) { var response = data; console.log(typeof(response))}`, the console output is `object`. Am I using the `data` right here? — reiallenramos, Jan 31 '18 at 01:01
Yeah, that should be a valid object. You should do `console.log(response)` to see what you have. BTW, seems extraneous to assign `data` to the `response` variable. — jvillian, Jan 31 '18 at 01:01
Okay now in the console I'm getting object with actual data inside. It's just a matter of accessing them properly. Thanks! — reiallenramos, Jan 31 '18 at 01:05

score 2 · Accepted Answer · answered Jan 31 '18 at 01:11

Your controller method should look like:

def foo
  @events = Event.where(id: params[:event_id])
  render json: { events: @events }
end

The render json: will create a valid JSON response.

Then, you should be able access your data object like this:

function testAJAX() {
  var test_url = "#{foo_events_path}";
  $.ajax({
    type: "GET",
    url: test_url,
    data: {
      event_id: 1
    },
    success:function(data) {
      alert(data.events);
    }
  });

AJAX to fetch model data from view

View:

events_controller.rb

routes.rb

1 Answers1