Damian Mehers' Blog Android, VR and Wearables from Geneva, Switzerland.

27Nov/066

Tip/Trick: Using ScriptManager ScriptPath to load MicrosoftAjax.js from file system

This isn't particularly tricky but it can be non-obvious.

If you don't want to use the embedded resources to serve the Microsoft AJAX JavaScript runtime, but instead you want to have them served from the file system, to make JavaScript debugging more pleasant, then this is what you need to do:

Create a directory structure under your web application's root directory

You'll need to create a directory structure that corresponds to the attributes of the assembly that normally contains the script files.  In your case you'll can create a subdirectory structure in your web site like this:

Scripts\Microsoft.Web.Extensions\1.0.61025.0

The top directory doesn't have to be called Scripts you can call it anything you wish.  Since MicrosoftAjax.js is in the Microsoft.Web.Extensions assembly, this is why the second directory level is called Microsoft.Web.Extensions.  The final directory is the version number of the DLL.  You can see this from your web.config:

<compilation debug="false">
  <assemblies>
     <add assembly="Microsoft.Web.Extensions, Version=1.0.61025.0, ..."/>
  </assemblies>
</compilation>

Copy the ASP.NET AJAX JavaScript runtime files

When you installed ASP.NET AJAX you'll have had the ASP.NET AJAX JavaScript source files installed, by default into:

C:\Program Files\Microsoft ASP.NET\ASP.NET 2.0 AJAX Extensions\v1.0.61025\ScriptLibrary\Debug

and

C:\Program Files\Microsoft ASP.NET\ASP.NET 2.0 AJAX Extensions\v1.0.61025\ScriptLibrary\Release

Copy MicrosoftAjax.js from the Debug directory into your Scripts\Microsoft.Web.Extensions\1.0.61025.0 directory, and rename it to Microsoft.Web.Resources.ScriptLibrary.MicrosoftAjax.debug.js.  Then do the same for MicrosoftAjaxTimer.js and MicrosoftAjaxWebForms.js following the same pattern of adding "Microsoft.Web.Resources.ScriptLibrary." to the start of the filename, and then adding ".debug" in front of the ".js".

Also copy the same files from the Release directory but this time rename them without adding the ".debug" in front of the ".js".

Now the source files will be picked up whether or not you are running in debug mode.

Set the ScriptPath on your ScriptManager

Finally, set the ScriptPath property on ASP.NET ScriptManager to tell it to source the ASP.NET AJAX runtime from your new directory:

<asp:ScriptManager ID="sm1" runat="server" ScriptPath="~/Scripts">
</asp:ScriptManager>

Verifying that the JavaScript files are being served from files

If you do a "View Source" in Internet Explorer you should see the JavaScript files being included from the appropriate location:

<script src="Scripts/Microsoft.Web.Extensions/1.0.61025.0/
Microsoft.Web.Resources.ScriptLibrary.MicrosoftAjax.js"
type="text/javascript"></script>
 

About Damian

Filed under: AJAX Leave a comment
Comments (6) Trackbacks (2)
  1. Thank you Damian.
    I was searching for this.

  2. In the final release Microsoft have made this a lot easier since they have pre-structured their directories as required. In order to get this to work you need only copy MicrosoftAjaxLibrary from C:\Program Files\Microsoft ASP.NET\ASP.NET 2.0 AJAX Extensions\v1.0.61025 to your application directory, and set up your ScriptPath to point to ~/MicrosoftAjaxLibrary

  3. Damian,

    I added the Java Script files and I get an exception thrown that it cant find the files it wants. It is looking in
    Scripts/System.Web.Extensions/2.0.0.0/MicrosoftAjax.debug.js

    instead of
    Scripts/System.Web.Extensions/1.0.61025.0/

    Do you have any idea why it is ooking for 2.0.0.0 and where do i need to change it? I looked in my code and 2.0.0.0 is only used for famework stuff as expected.

    If I change my directory name to 2.0.0.0, everything works fine.

    Thanks!

  4. Ajax is a great tool but… Microsoft AJAX JavaScript runtime files (MicrosoftAjax.js and MicrosoftAjaxWebForms.js) have been loaded once for each page. That is the main disadvantage of using Ajax: loading a page is weighted with additional size of those two JavaScript files. Is it possible to load those files only one time and then reuse them for each page in application? By using cache for example?

  5. I get “Warning:Unresponsive script
    A script on this page may be busy, or it may have stopped responding. You can stop the script now, open the script in the debugger, or let the script continue.” on my web site. If I click on the Continue button I get what I wanted, but the time it takes can not be tolerated.

    The script in question is MicrosoftAjax.js
    Can anyone tell me why do I get this warning and how do I eliminate it?

  6. I read your blog for asp.net 2.0. I wonder if you have solution about this problem.I am using framework 3.5 and ajaxtoolkit 3.0.30930.

    I would like to load ajaxtoolkit javascript files from a directory. I download the scripts from here AJAX Control Toolkit – Script Files Only .

    Created two subdirectories on my .net project

    \scriptsAJAX\System.Web.Extensions\3.5.0.0\3.5.30729.196\

    I copied these two files on he above directory: MicrosoftAjax.debug.js and MicrosoftAjax.js

    \scriptsAJAX\AjaxControlToolkit

    The above folder has all the script files (*js) that i download from ajax control toolkit

    Now I set the ScriptPath property on ScriptManager to ScriptPath=”~/scriptsajax”

    I have a very sample test page that has DropDownList and CalendarExtender. When I browse the page then I get these errors:

    Error: ASP.NET Ajax client-side framework failed to load.

    Error: ‘Sys’ is undefined

    Yes I did register

    Could someone help me to solve this problem.What files is it missing?
    Thank you


Leave a comment