JQuery Load using MVC3 @Url.Action does not pass parameters properly

Question

I noticed that doing @Url.Action("myAction", new { param1 = 123, param2 = 456}) provides me with an invalid URL Home/myAction?param1=123&param2=456.

I am attempting to do

$("#myAjaxDiv").load(url);

But only param1 is getting populated in the action method.

When I remove the & and make it just & then it works, but doing a string replace is super hacky.

url = url.replace("&amp;", "&");

Am I missing something here?

EDIT: Per request I'm including some of my sample app. (you can create a new MVC app and just add these quickly and see for yourself)

Controller:

public ActionResult AjaxTest(int? year, int? month)
{
    ViewBag.Message = string.Format("Year: {0}, Month: {1}", year.HasValue ? year.ToString() : "no year", month.HasValue ? month.ToString() : "no month");
    return PartialView("AjaxTest");
}

AjaxTest View:

@ViewBag.Message

Index View:

<script>
    $(function () {
        var url="";
        $("#noParams").click(function () {
            url = "Home/AjaxTest";
            $("#ajaxy").load(url)
            $("#url").text(url);
        });
        $("#yearParam").click(function () {
            url = "Home/AjaxTest?year=2012";
            $("#ajaxy").load(url)
            $("#url").text(url);
        });
        $("#yearAndMonthParam").click(function () {
            url = "Home/AjaxTest?year=2012&month=10";
            $("#ajaxy").load(url)
            $("#url").text(url);
        });

        $("#generated").click(function () {
            url = "@(Url.Action("AjaxTest", new { year=2012, month=10}))";
            $("#ajaxy").load(url);
            $("#url").text(url);
        });

    });
</script>

<a id="noParams" href="#">No Params</a> <br />
<a id="yearParam" href="#">Year Param</a> <br />
<a id="yearAndMonthParam" href="#">Year and Month Param</a> <br />
<a id="generated" href="#">Generated</a> <br />
<div id="ajaxy">

</div>

<div>
URL: <span  id="url"></span>
</div>

that's weird, looks like you're not the only one ... stackoverflow.com/questions/2898855/… — Alex
– Alex, Commented Oct 12, 2012 at 19:55
Can you post how do you populate your url parameter? I guess you are missing a Html.Raw() somewhere... — nemesv
– nemesv, Commented Oct 12, 2012 at 19:55

nemesv · Accepted Answer · 2012-10-12 20:12:34Z

14

By default every content (which is not IHtmlString) emitted using a @ block is automatically HTML encoded by Razor (see this Razor intro article Html Encoding section)

The Url.Action returns just a plain string so thats why the & gets encoded.

Use the Html.Raw if you don't want the encodeing:

url = "@(Html.Raw(Url.Action("AjaxTest", new { year=2012, month=10})))";

answered Oct 12, 2012 at 20:12

nemesv

140k16 gold badges424 silver badges364 bronze badges

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

3 Comments

Nathan Koop Over a year ago

both of these work, but they're not as clean feeling as I'd like

nemesv Over a year ago

@NathanKoop whether something is clean or not clean is very subjective. This is how Razor and it's encoding works... usually you don't use the Url.Action method directly but the Html.BeginForm or Html.ActionLink helpers which takes care of the encoding.

Alex Over a year ago

after thinking about it some more, it seems like the right design decision. changing the return value of Url.Action to a Type would then require consumers of it to call .ToString() on it when used from C# classes (as Url.Action can be used in both Views and Classes) ...

Shyju · Accepted Answer · 2012-10-12 20:05:11Z

4

You can build the url in this way also.

var url = "@Url.Action("AjaxTest","YourControllerName")?year=2012&month=10";
$("#ajaxy").load(url);

answered Oct 12, 2012 at 20:05

Shyju

220k106 gold badges421 silver badges499 bronze badges

1 Comment

Nathan Koop Over a year ago

both of these work, but they're not as clean feeling as I'd like

Collectives™ on Stack Overflow

JQuery Load using MVC3 @Url.Action does not pass parameters properly

2 Answers 2

3 Comments

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

3 Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related