CODEWITHSUNDEEP
javascriptasp.net-mvcasp.net-mvc-4
ruhler
ruhler

Reputation: 257

MVC 4 Pass value from Javascript to Controller

In my view, I have a javascript function to handle a select event on a pie chart. The function is shown below:

function selectHandler() {
    var selectedItem = visualization.getSelection()[0];
    if (selectedItem) {
        var val = data.getFormattedValue(selectedItem.row, 0);
        location.href = '/Tickets';
    }
}

Currently I am on the Home Controller in the Groups View. I want to navigate to the Index View of the Tickets Controller while passing the selected value from the javascript variable "val". How would I go about doing this?

Upvotes: 0

Views: 9750

Answers (4)

Justin Helgerson
Justin Helgerson

Reputation: 25551

//On page load the server will generate the URL for you.
var ticketURL = '@Url.Action("Index", "Tickets")';
//Append the value to the URL
ticketURL = ticketURL + '?val=' + val;
//Do your stuff!

Upvotes: 1

David Driscoll
David Driscoll

Reputation: 1419

Are you intending to manually navigate the user?

If you're looking for a redirect JavaScript way, then you would do something as simple as...

location.href = '/Tickets?value=' + val;

Now this may not work for everything. For example, if location.href already contains a '?', and you need to maintain that context, then you need to use '&'. Maybe your app lives in a Virtual Directory.

You might do something like...

var newUrl = location.href;
if (newUrl.indexOf('?') > -1)
  newUrl += '&';
else
  newUrl += '?';

newUrl += val;

This allows you maintain any existing context as well.

If you expect the ticket to already be defined, you might need to remove that from the query string, if it already exists.

In that case then you might want to do something like...

var params = location.search.substring(1).split('&'),
    paramToRemove, indexOfValue,
    hasSearch = false,
    param;
for (var i = 0, len = i; i < len; i++)
{
  param = params[i];
  indexOfValue = param.indexOf('value');
  hasSearch = param.indexOf('?') === 0;
  if (indexOfValue  === 0 || (indexOfValue === 1 && hasSearch ))
  {
    paramToRemove = params[i];
    break;
  }
}

var newUrl = location.href;
// Remove old value
if (paramToRemove) newUrl = newUrl.replace(paramToRemove, hasSearch ? '?' : '');

// Add proper search char
if (newUrl.indexOf('?') > -1)
  newUrl += '&';
else
  newUrl += '?';
// Add new value
newUrl += val;

Upvotes: 2

Rahul Pal
Rahul Pal

Reputation: 96

Since, you are calling Controller methods from javascript. You should make an POST ajax call to Ticket Controller and passing Action method name also.

Your code would be like this:

return $.post('/Ticket(ControllerName)/Index(method name)/',parameters here);

Inside API Controller, Index method will accept the same param which we are passing from our javascript.

ActionResult Index(parameter){...}

Upvotes: 0

Andrey M.
Andrey M.

Reputation: 3806

location.href = '/Tickets?val=' + val;

Upvotes: 1

Related Questions