Asp.net MVC controller parameter null when action called from javascript

Question

I am new to MVC, and trying to navigate via js to a controller action method. The code works (as in the action method is hit), but the parameter value I am passing in is always null

js:

  window.location.href = "@Url.Action("Step1", "Reports")" + "/?" + rsid;

Controller action:

public class ReportsController : Controller    {

     public ActionResult Step1(int? rsid)
        {

          //do stuff
        }
}

The rsid parameter is always null. I have tried various link formats, eg "/?rsid=[id]", "/[id]"

Do I need a custom route for the parameter to be picked up?

Or maybe annotate the action method with [httpPost] or [httpGet]?

have you tried "@Url.Action("Step1", "Reports")" + "/?rsid=" + rsid ? — Rick Su
– Rick Su, Commented Apr 16, 2015 at 0:44
You not providing any value for the parameter rsid (so it null) — user3559349
– user3559349, Commented Apr 16, 2015 at 0:46
Also, download fiddler. Its very helpful to see what parameters are sent and makes it easier to identify issues — Polynomial Proton
– Polynomial Proton, Commented Apr 16, 2015 at 1:02

Nikola Davidovic · Accepted Answer · 2015-04-16 00:48:30Z

2

The easiest way to do it is to just name the parameter "id" since it is in the default route and call from js like this:

'@Html.ActionLink("Step1", "Reports", new { id = ' + rsid + ' })'

public ActionResult Step1(int? id)
{

          //do stuff
}

answered Apr 16, 2015 at 0:48

Nikola Davidovic

8,6761 gold badge31 silver badges34 bronze badges

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

1 Comment

QMaster Over a year ago

In my case parameter value (for example rsid here) are encode with javaScript encodeURIComponent() so in MVC Action return parameter has null value, I don't know why!

Marko · Accepted Answer · 2015-04-16 00:52:56Z

2

You probably mapping to a default route which is: /controller/action/id. Now in your action declaration you named your parameter as rsid which will not map to id because name is different. Change your action signature to:

public ActionResult Step1(int? id)

or option b) is specify the name of your parameter from js side:

window.location.href = "@Url.Action("Step1", "Reports")" + "/?rsid=" + rsid;

answered Apr 16, 2015 at 0:52

Marko

13.4k12 gold badges52 silver badges64 bronze badges

Comments

spender · Accepted Answer · 2015-04-16 01:17:25Z

2

No need for string concatenation. It's bug prone, as you've discovered. Simply provide an anonymous object with your route values (using a different overload of UrlHelper.Action) and let MVC routing decide how to represent it all.

To make this fail-safe, you'll also need to make sure your URL is safe to store in a JavaScript string by wrapping it in a call to HttpUtility.JavaScriptStringEncode, then rendered without HTML encoding by wrapping in Html.Raw:

window.location.href = 
 "@Html.Raw(HttpUtility.JavaScriptStringEncode(Url.Action("Step1", "Reports", new{rsid})))";

You could simplify matters with a helper extension method (an extension on HtmlHelper seems convenient to me)

public static class JavascriptHelperEx
{
    public static IHtmlString QuotedJsString(this HtmlHelper htmlHelper, string str)
    {
        //true parameter below wraps everything in double quotes:
        return htmlHelper.Raw(HttpUtility.JavaScriptStringEncode(str, true));
    }
}

So now:

window.location.href = @Html.QuotedJsString(Url.Action("Step1", "Reports", new{rsid}));

edited Apr 16, 2015 at 1:17

answered Apr 16, 2015 at 0:51

spender

121k36 gold badges245 silver badges369 bronze badges

3 Comments

Alexei Levenkov Over a year ago

Yes, also still need @Html.Raw(... as @ will HtmlEncode the url. location.href may handle such over-encoded url, but regular url manipulation in JavaScript will likely be completely confused (not directly applicable to OP's case)...

Alexei Levenkov Over a year ago

Yes... One option is to wrap it in helper code that will return HtmlString to avoid Html.Raw (combining answers from here for example... ). I know there are couple good answers with versions I like, can't find them now.

spender Over a year ago

@AlexeiLevenkov: Thx for your contributions

David · Accepted Answer · 2015-04-16 00:52:15Z

0

What URL does this create?

"@Url.Action("Step1", "Reports")" + "/?" + rsid;

Something like this:

http://server/controller/action/?123

There's no parameter in that URL called rsid, so the model binder doesn't know where to find that value. You need to give the value a key:

"@Url.Action("Step1", "Reports")" + "/?rsid=" + rsid;

This would create something more like this:

http://server/controller/action/?rsid=123

answered Apr 16, 2015 at 0:52

David

221k42 gold badges245 silver badges337 bronze badges

1 Comment

Programnik Over a year ago

Thanks David, I think I discovered the issue, if I rename my controller param to id and get rid of the question mark in the url it works because it matches a default routing pattern. So does that mean if I want to have meaningful parameter names (rather than just id) in controller actions I need to have a custom route mask for each param pattern? (or just extract the param values from the query string old-school)

jmvtrinidad · Accepted Answer · 2015-04-16 01:09:51Z

0

try to have a rsid after the ? so the value will map to rsid

window.location.href = "@Url.Action("Step1", "Reports")" + "/?rsid=" + rsidValue;

answered Apr 16, 2015 at 1:09

jmvtrinidad

3,6986 gold badges25 silver badges42 bronze badges

Collectives™ on Stack Overflow

Asp.net MVC controller parameter null when action called from javascript

5 Answers 5

1 Comment

Comments

3 Comments

1 Comment

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

5 Answers 5

1 Comment

Comments

3 Comments

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related