Question

I know there’s an easy answer to this, but this comes in the form of 2 problems.

Problem 1:

In an asp.net page there is a javascript block like this:

<script type="text/javascript">
    function doSomethingRandom() {
        var myVarToUse = <asp:Literal runat="server" ID="HackyLiteral" />
    }
</script>

Ok, so it’s a simplified version of the problem, but it should be clear. I now want to move this function in to a JS file…but I can’t get the asp:Literal into the JS.

var myVarToUse = <asp:Literal runat="server" ID="HackyLiteral" />
<script src="myJSFile.js" />

…Makes me a little sick, is there a better way?

Problem 2:

Similar problem, but this time the second version looks like this:

<asp:ScriptManagerProxy runat="server">
    <Scripts>
        <asp:ScriptReference Path="~/tree/AttributeTree.js" />
    </Scripts>
</asp:ScriptManagerProxy>

But this time I can’t realistically put the

var myVarToUse = <asp:Literal runat="server" ID="HackyLiteral" />

above it because with the ScriptManagerProxy there’s no real way of knowing exactly where the script file is going to appear.

So, them’s the problems! Thanks.

Answer 1

We use the Page‘s RegisterStartupScript method to register initialization functions with the ClientScriptManager. Our Javascript files only contain functions and are loaded via ScriptManager (like in your snippet). We wrote an extension method for the Page (called JSStartupScript) that helps with registering the startup scripts and at the end of the day our code looks like the following:

<%
   Page.JSStartupScript(string.Format("initFeatureX({0}, {1}, {2});",
      AntiXss.JavaScriptEncode(ViewData.Property1),
      AntiXss.JavaScriptEncode(ViewData.Property2),
      AntiXss.JavaScriptEncode(ViewData.Property3)));
%>

This also works great in combination with the ScriptManagers CompositeScript collection and LoadScriptsBeforeUI = false setting.