Passing data from Ajax to Rails controller

Question

I'm having a little problem with my rails app. I am trying to pull a random name from an array and pass it into my rails controller and into a method.

This is my AJAX:

var artists = [array with some names]
randomA = {}

var randomArtist = artists[Math.floor(Math.random()*artists.length)];

randomA['a_name'] = randomArtist.toString();

$.ajax({
    url: "/songs_echowrap/" + randomA.a_name,
    dataType: "json"
    }).success(function(data) { 
        Do Stuff   
    }


    });  
});

Here is my routes:

get 'songs_echowrap/:artist_name' => 'users#get_echonest'

Here is my controller:

def get_echonest 

    foo = params[:artist_name]

    @rec = Echowrap.playlist_basic(:artist => params[:artist_name] , :results => 25)

    render json: @rec

end

The param is 'undefined' when i run a binding.pry in my terminal.

Have you tested this in the browser? Why do you get? Look in dev tools to see the request parameters. Raise the params hash in the controller action to see if the params do contain the artist name. — Mohamad
– Mohamad, Commented Nov 19, 2014 at 1:33
@Mohamad yes, I've done a console.log(randomA.a_name) and it does return a random artist's name which is what i want. But I don't think its reaching the controller correctly. In the terminal when I run a binding.pry, 'foo' is equal to "undefined" — edrhuang
– edrhuang, Commented Nov 19, 2014 at 1:57
Not console.log() Check the Rails request. Raise an error in the controller action and check dev tools to see the raised params hash in the request response. You will see exactly what params contains. Then you will no if this is your JavaScript or something else. — Mohamad
– Mohamad, Commented Nov 19, 2014 at 10:41

rick · Accepted Answer · 2014-11-19 03:32:44Z

1

Do like this in ajax,

$.ajax({
  type: "GET",
  url: "/songs_echowrap?artist_name=" + randomA.a_name,
  datavalue: 'html',
  }).success(function(data) { 
    Do Stuff 
  }
 });
});

In routes,

get 'songs_echowrap' => 'users#get_echonest'

In controller,

def get_echonest
  foo = params[:artist_name]
  @rec = Echowrap.playlist_basic(:artist => params[:artist_name] , :results => 25)
  render json: @rec
end

edited Nov 19, 2014 at 3:32

answered Nov 19, 2014 at 3:20

rick

1,7053 gold badges15 silver badges28 bronze badges

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

Comments

score 0 · Accepted Answer · 2014-11-19 02:09:00Z

0

Within your ajax call you should specify the method (in this case, looks like a GET) and the data required:

$.ajax({
  type: "GET", 
  url: "/songs_echowrap/" + randomA.a_name,
  data: randomA.a_name,
  }).success(function(data) { 
    Do Stuff   
}
});  
});

edited Nov 19, 2014 at 2:09

answered Nov 19, 2014 at 1:34

user3720516

3 Comments

edrhuang Over a year ago

oh, i thought i misread your answer for a second. Even when I put it back the param is still undefined in my controller.

user3720516 Over a year ago

What do you get with params[:data] with the solution I suggested?

edrhuang Over a year ago

the params[:data] returns nil

Choco · Accepted Answer · 2014-11-19 07:25:14Z

0

Try This: small change with your code, it will work add data varidable in your ajax call like this:

var artists = [array with some names]
randomA = {}

var randomArtist = artists[Math.floor(Math.random()*artists.length)];

randomA['a_name'] = randomArtist.toString();

$.ajax({
    url: "/songs_echowrap/" + randomA.a_name,
    dataType: "json",
    data: {artist_name: randomA.a_name }
    }).success(function(data) { 
        Do Stuff   
    }


    });  
});

answered Nov 19, 2014 at 7:25

Choco

1,0641 gold badge7 silver badges20 bronze badges

Comments

Community · Accepted Answer · 2017-05-23 10:26:27Z

Sorry, I am relatively new to Javascript and I should have been more clear with my code.

I realized that one of my variables was in the wrong scope so it kept returning as undefined. I was making two AJAX requests, and I thought i could return the value from the first and pass it through to the second. This question helped me understand my problem: How do I return the response from an asynchronous call?

this is my javascript now:

$('span').on('click', function(){
    $('#s_title').empty();
    $("#playlist_title").empty();
    $("#viito_list").empty();

    var p_title = $(this).html();
    $("#playlist_title").append(p_title);

    var id = $(this).data("id");
    var artistsList = []

    $.ajax({
        url: "/songs/"+id,
        dataType: "json",
        success: successCallback
    })

    function successCallback(data){
        for(var i = 0; i < data.length; i++){
                function msToTime(duration) {
                    var seconds = parseInt((duration/1000)%60),
                        minutes = parseInt((duration/(1000*60))%60)
                    minutes = (minutes < 10) ? "0" + minutes : minutes;
                    seconds = (seconds < 10) ? "0" + seconds : seconds;

                    return minutes + ":" + seconds ;
                }

            artistsList.push(data[i].artists[0].name);

            $("#s_title").append("<tr> <td>" + data[i].name + "</td>" + "<td>" + data[i].artists[0].name + "</td>" + "<td>" + msToTime(data[i].duration_ms) + "</td>" + "<td><span class='glyphicon glyphicon-remove song-select'></span>" + "</td> </tr>")
        }

        randomArtist = artistsList[Math.floor(Math.random()*artistsList.length)];
        getWeird(randomArtist)
    }


    function getWeird(rando){

        $.ajax({
        type: "GET",
        url: "/songs_echowrap?artist_name=" + rando,
        dataType: "json"
                }).success(function(data) {
                  $("viito_list").empty();

                  for(var i = 0; i < data.length; i++){

                    $("#viito_list").append("<tr> <td>" + data[i].title + "</td>" + "<td>" + data[i].artist_name + "</td> </tr>")
                  }


                });
    }


});

Collectives™ on Stack Overflow

Passing data from Ajax to Rails controller

4 Answers 4

Comments

3 Comments

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

Comments

3 Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related