anon_swe
anon_swe

Reputation: 9345

How do I manipulate a JSON object returned by AJAX?

I have this jQuery in my Rails app:

  $('#rankings_link a').click(function(){
    $.ajax({
      dataType: 'json',
      contentType: 'application/json',
      url: '/rankings',
      type: 'get'
    }).done(function(received_data){
      for (var m = 0; m < received_data.length; m++) {
        $('#rankings ol').append('<li>' + received_data[m] + '</li>');
      }
    });
  });

At the end of the rankings method in my controller is:

:render => 'json'

But when I click on the #rankings_link, it sends me to /rankings and displays a large block of preformatted text like this:

["Farag, Ali", "Harrity, Todd", ...]

I want to be able to put each element of (what seems to be) the array in an ordered list. But clearly this isn't what's happening and I don't know why.

Thoughts?

Upvotes: 0

Views: 287

Answers (3)

Maleen Abewardana
Maleen Abewardana

Reputation: 14572

Try to validate your JSON before sending it to the view.

It is better if you can send some hard coded JSON first. The Online JSON Viwer validates JSON in a nice way.

You can can also create the JSON manually and render it as text, jQuery will return it as JSON.

There is the to_json method in ActiveSupport, you can try that also.

Upvotes: 0

Anton Grigoryev
Anton Grigoryev

Reputation: 1219

Add :remote => true as the link param, also make sure you have in your application.js:

//= require jquery
//= require jquery_ujs

Upvotes: 0

Dogbert
Dogbert

Reputation: 222128

You need to stop the default action of <a> (which is to open the page specified by href attribute)

$('#rankings_link a').click(function(e){
  e.preventDefault(); // <- this
  // ...
});

Upvotes: 1

Related Questions