Using jQuery/JavaScript to pass variables to Ruby on Rails, within Rails

Question

Using Ruby on Rails and, where needed, jQuery/JavaScript. I'm having a particular problem with JS when I need to collect information and pass it back to Rails. At that point, I use POST to send the information. An example would be:

 $('#moveslotsbutton').on('click', function () { var source = 'lots'; var rows = []; var rowi = -1; $.each(moveslotstable.rows('.active').data(), function (i, val) { $(rowi = rowi + 1, rows[rowi] = val[0]) }); $.post('/moves_update', { commit: 'Moves Lots', source: source, active: rows } ); return false; }); 

Here, I need to collect an array of information to send to Rails which is "active". This allows the user to select multiple rows from a table and submit it for processing using the "active" array, along with some explanatory scalars.

The problem here seems to be that Rails doesn't really know what's going on and therefore cannot logically respond. In fact, a render functions in that an HTML status of 200 is returned, but the screen does not update in any case. In order to get a response, I need to go back to JS as follows:

 def update commit = params[:commit] case commit when "Moves Lots" lots = params[:active] @rows = Array.new lots.each { |lot| @rows = @rows + Lot.lot_rows(lot) } render js: "window.location.assign(location.origin + '/moves_indexrows')" else flash[:alert] = "Invalid request: #{commit}" result = [false, "Processing Error"] end end 

This then fires controller "moves" with action "indexrows". However, because I am going back to JS, it doesn't know about @rows and cannot use it in the following view. (Action indexrows was originally part of index, I just pulled it out to better understand it.)

I looked at using JS submit(), which would keep it within Rails, but it's not going to pass the required variables? Is there some way to do what I am trying to do, meaning to create and pass JS variables to Rails, and have Rails controlling the process? Am I missing something? Thanks.

Answer 1

You can do it in this way,

 $('#moveslotsbutton').on('click', function () { var source = 'lots'; var rows = []; var rowi = -1; $.each(moveslotstable.rows('.active').data(), function (i, val) { $(rowi = rowi + 1, rows[rowi] = val[0]) }); //changing $.post to $.ajax and then handling the response in success callback. $.ajax({ url: '/moves_update', method: 'post', data:{ commit: 'Moves Lots', source: source, active: rows }, success: function(data){ //the response 'data' contains rows within it window.location.assign(location.origin + '/moves_indexrows'); } }); return false; }); 

In controller:

def update commit = params[:commit] case commit when "Moves Lots" lots = params[:active] @rows = Array.new lots.each { |lot| @rows = @rows + Lot.lot_rows(lot) } # rendering @rows in json render text:@rows.to_json else flash[:alert] = "Invalid request: #{commit}" result = [false, "Processing Error"] end end