Shantanu Bhalerao
Shantanu Bhalerao

Reputation: 153

Sending Javascript variable to Rails 3 controller using Jquery

I am using Rails 3, Jquery-UJS and Jquery. I have a working setup of Jquery with Rails3 .I am trying to send a variable from Javascript to Rails controller by clicking a link.

My current approach is using js as follows to make an ajax call and pass msg string.

$("#select_link").click(function() 
{$.ajax({
type: 'POST',
url: 'http://your_url/jmsg',
data: {msg: "hello world"},
;}
});
});

Should I include this code in my application.js file?

In my .html.erb file I have

<%= link_to "Send variable", jmsg_path, :remote => true %>

In my controller I have

def jmsg
@message= params[:msg]
respond_to do |format|
format.js
end
end

Till now, I've not been able to get the javascript variable in my @message instance variable

EDIT:

I made changes as suggested. However, the variable @message is not set when I do

  @message=params[:msg]

When I check XHR using Fiebug, I see 302 Moved Temporarily for the POST action (the POST parameter msg is set correctly though). Response is - $("#show_message").html("")

My .js view is:

 $("#show_message").html("<%= @message %>")

EDIT2 : When I check Firebug, it shows that there are two actions now: 1. POST /jmsg - with response @message = "hello world" 2. GET /jmsg - with response @message= " "

Upvotes: 3

Views: 4245

Answers (3)

raymondralibi
raymondralibi

Reputation: 1953

When i wanna get any value from controller, i always use json format by doing something like these.

// jmsg.js.erb

{
  "message": "<%= @message %>"
}

// yourjs.js

$.ajaxSetup({
  'beforeSend': function(xhr) { xhr.setRequestHeader("Accept", "text/javascript") }
});

$("#select_link").click(function(){
  $.ajax({
    type: 'POST',
    url: 'http://your_url/jmsg',
    dataType: 'json',
    data: {msg: "hello world"},
    success: function(json, status, xhr){
      // $("#show_message").html(json.message)
    }
  });
});

// in your.html.erb, remove :remote => true

<%= link_to "Send variable", jmsg_path %>

Upvotes: 1

rookieRailer
rookieRailer

Reputation: 2341

Okay, I will share with you what I know about using AJAX and jQuery in Rails, in an unobtrusive manner:

First, include this at the beginning of your application.js file

jQuery.ajaxSetup({
  'beforeSend': function(xhr) { xhr.setRequestHeader("Accept", "text/javascript") }
});

Then, in the same file, create a function as follows, with is the function that loads before the DOM loads. In this function, you write your own functions:

$(function() {
   $("#select_link").sendVar();
}

jQuery.fn.sendVar = function(){
    this.click( function() {
    var msg= 'hello world';
       $.post('/your_url/jmsg/' + msg, function(data){

        })
       return false;
    });
}

Make sure you have a route for this post request in your routes.config file, for e.g.

match 'your_url/jmsg/:msg', :controller => 'your_url', :action => 'jmsg', :via => :post

Let me know if this works for you. A similar code worked for me, for a similar case. Thanks.

Upvotes: 0

ShankarSangoli
ShankarSangoli

Reputation: 69905

Add the below code into your application js and try this

$(function(){
    $("#select_link").click(function(){
       $.ajax({
        type: 'POST',
        url: 'http://your_url/jmsg',
        data: { msg: "hello world" },
       });
    });

});

Upvotes: 0

Related Questions