Referencing .js files for the AJAX Control Toolkit

I was recently working with someone that was leveraging the AJAX Extension and the Control Toolkit and they were running into an issue where a customer's environment was causing issues making requests to ScriptResource.axd.  Since they couldn't change the environment, they needed to reference the .js files directly.  Here's a rundown of the steps in case anyone needs to do this in the future:

1. Create a folder to hold the .js files in your site.  In my case I created a "Scripts" folder on the root of my app.

2. Create the following folder structure under the folder from Step 1.  The folder that is a version number should match the version of the control toolkit.  This can be found on the Releases page for the extension.

        - <Root>
                - Scripts
                        - AjaxControlToolkit
                                - 1.0.10301.0

3. Open the Control Toolkit project and build the solution.  This should generate the \obj folder that contains all the .js files.

4. Copy the Script files for the toolkit project to the site

        From:  <path_to_unzipped_toolkit>\AjaxControlToolkit\obj\Debug

        To:    1.0.10301.0 folder from above

5. Copy the Script files for the AJAX Extension:

        From:  Copy the System.Web.Extensions folder and all it's contents from C:\Program Files (x86)\Microsoft ASP.NET\ASP.NET 2.0 AJAX Extensions\v1.0.61025\MicrosoftAjaxLibrary

        To:    ~/Script folder.  You should have a folder structure similar to:

        - <Root>
                - Scripts
                        - System.Web.Extensions
                                - 1.0.61025.0

6. Set the ScriptPath on the <scriptManager> to "~/Scripts"

7. Make sure the controls are not explicitly setting ScriptPath as that will override the ScriptManager property.

Now when you browse the page, the .js files will be loaded from the ~/Scripts folder instead of via calls to ScriptResource.axd.  If you're getting script errors, take a netmon and ensure all the requests to the .js files are returning a status code of 200 or 304.

Comments

  • Anonymous
    May 29, 2007
    This won't work for the AjaxControlToolkit.ExtenderBase.BaseScripts.js file. It will be missing the JSON'd ScriptResources section at the bottom. Take a look at the differences in Fiddler when you specify a ScriptPath and when you don't. For some reason when the script is served up with ScriptResource.axd those resource strings will get JSON'd at the end of the AjaxControlToolkit.ExtenderBase.BaseScripts file. The AjaxControlToolkit.ExtenderBase.BaseScripts.js file in the obj will not have those resource strings. Causes major breakage with Calendar and other AJAX controls that depend on those strings. I solved the problem by looking at the AjaxControlToolkit.ExtenderBase.BaseScripts.js file that was being served with fiddler, and then appended the JSON'd resource strings to the bottom of the AjaxControlToolkit.ExtenderBase.BaseScripts.js file that I copied from the obj directory. Now everything is working.