Razor jQuery conflict:

Question

So I have this source in my .cshtml file:

@if (Model.IsAdmin) 
   {
        $("#back-button").click(function () {
            window.location.href = "@(Url.Action("ChooseEvent", "Console", new RouteValueDictionary { { "eventId", Model.EventId } }))";
        });
}

This appears to be causing all kinds of build time errors to surface in my VS2010 IDE from ") expected" to "Unexpected character '$'".

I have tried wrapping the '$' like this:

<text>$("#back-button")</text>.click(function () {
   window.location.href = Url.Action("ChooseEvent", "Console", new RouteValueDictionary { { "eventId", Model.EventId } });
});

But this leads to an error about ") expected" on the first brace.

This is from an older .aspx file that I'm trying to convert to Razor. The original source looked like this:

<% if (Model.IsAdmin) 
   { %>
        $("#back-button").click(function () {
            window.location.href = "<%= Url.Action("ChooseEvent", "Console", new RouteValueDictionary { { "eventId", Model.EventId } }) %>";
        });
<% } %>

jQuery and Razor are not cooperating for me.

How do I get past these errors?

Answer 1

This worked:

@if (Model.IsAdmin) 
   {
        <text>$("#back-button").click(function () {
            window.location.href = '@Url.Action("ChooseEvent", "Console", new RouteValueDictionary { { "eventId", Model.EventId } })';
        });</text>
}

I couldn't prefix the JavaScript here with @ (like when calling a JavaScript function @myJavaScriptFunction), so I had to use the more cumbersome notation.