Javascript variable in razor ActionLink

Question

var boxIdValue = 233;
var result = title + '<br/>@Html.ActionLink("Detail", "Show", "Boxes", new{boxId=233}, null)';

When I hardcode boxId then it works. But when I write:

var result = title + '<br/>@Html.ActionLink("Detail", "Show", "Boxes", new{boxId=boxIdValue}, null)';

It doesn't. Is it possible to mix javascript var and razor in this way?

Solution

Have a look at this related Stack Overflow question.

The reason why this is a challenge is that the Razor method executes on the web server at render time while the javascript executes on the client browser at runtime.

I would solve this by doing something like

var boxIdValue = 233;
var link = '@Html.ActionLink("Detail", "Show", "Boxes", new{boxId=-1}, null)'
link = link.replace('-1', boxIdValue);
var result = title + '<br />' + link;