MVC 4 Pass value from Javascript to Controller

Question

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?

see this [stackoverflow.com/questions/13878418/… [1]: stackoverflow.com/questions/13878418/… — Mohammad Atiour Islam
– Mohammad Atiour Islam, Commented Jan 20, 2014 at 12:53

David Driscoll · Accepted Answer · 2013-06-07 18:39:17Z

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;

Andrey M. · Accepted Answer · 2013-06-07 18:19:30Z

1

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

answered Jun 7, 2013 at 18:19

Andrey M.

3,8044 gold badges35 silver badges39 bronze badges

1 Comment

ruhler Over a year ago

Not sure if I like using the query string, but this definitely works while everything else I tried fails.

Justin Helgerson · Accepted Answer · 2013-06-07 18:51:26Z

1

//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!

edited Jun 7, 2013 at 18:51

answered Jun 7, 2013 at 18:19

Justin Helgerson

25.7k19 gold badges104 silver badges128 bronze badges

2 Comments

ruhler Over a year ago

This errors out with the message "The name 'val' does not exist in the current context". I tried doing this as well: location.href = '@Url.Action("Index", "Tickets", new { value = @:val })'; but that didn't work either with the error saying the parenthesis don't match up.

Justin Helgerson Over a year ago

@ruhler - Sorry, I was running low on caffeine. I updated my post with the correct code. You may need to restructure it depending on what you need to do, but, the must-have code is there.

Rahul Pal · Accepted Answer · 2013-06-07 18:26:53Z

0

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){...}

answered Jun 7, 2013 at 18:26

Rahul Pal

967 bronze badges

1 Comment

ruhler Over a year ago

This seems to return the view within my current view, which is not what I want to do (unless I am doing it wrong?). I want to actually navigate to the Tickets view.

Collectives™ on Stack Overflow

MVC 4 Pass value from Javascript to Controller

4 Answers 4

Comments

1 Comment

2 Comments

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

Comments

1 Comment

2 Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related