In your existing custom control (i.e. the custom control prior to ASP.NET AJAX), if you had a JavaScript file (.js file), you probably did the following to embed it in the custom control assembly.

Adding JS file to a custom control without ASP.NET AJAX

First, you used the WebResource to include that js file in the assembly. Here the name of the JavaScript file is AJAXWrite.js and it is in the js directory and the custom control assembly is AJAXWrite – that’s what the notation below says.

You will then let the Page know that it should be aware of a JavaScript file:

This process is described in detail in the following article:

Embedding JavaScript files in your custom controls

However, now you have decided to add the ASP.NET AJAX functionality to the above JavaScript file. Meaning, if you called any ASP.NET AJAX classes that are in the MicrosoftAjax.js and other files, those files should be loaded and available when your .js file needs them.

The ASP.NET AJAX mechanism that takes care of loading the appropriate JavaScript files is ScriptManager. If you used registerNamespace or registerClass in your .js file, then the browser should be able to find these methods when it needs them. Adding ScriptManager to your page will eventually load all the client-side files from ASP.NET AJAX, but it might do it after your js file is loaded. This will cause errors because the browser won’t find registerNamespace when it’s needed.

First of all, the following article describes in detail how to add ScriptManager to the custom control:

Incorporating ASP.NET AJAX into existing Custom Controls and JavaScript files

Adding JS file to a custom control with ASP.NET AJAX

Once you have done that (adding and checking for the ScriptManager), you need to add the script references to the ScriptManger that’s on the current page. You do that with the following code:

ScriptReference is a flexible class which can take scripts from either a particular path from the web server or from an assembly, where these .js files are embedded.

In the above code, Name of the file and Assembly in which that file resides are updated via the Name and Assembly properties on the ScriptReference class. You can also use the constructor for this purpose:

The second line above uses the Scripts property of the current ScriptManager to add the .js file (the ScriptReference) we are interested in adding. Scripts is derived from the class ScriptReferenceCollection.

The ScriptReferenceCollection is just a collection of ScriptReference objects, as you can see from the following definition of the ScriptReferenceCollection class:

The Collection generic class is new in ASP.NET 2.0. As the name suggests, several collection type public methods like Add, Remove, Insert, etc. are available in this class.

Figure 1. The relationship between the ScriptManager and ScriptReference

What are the changes?

With the ScriptManager, you need the following.

Embed the .js file

If you are going to embed the .js file in your assembly like before, you still need to use the WebResource attribute.

Don’t have to tell the Page

At this point, you don’t need to tell the Page that there is a JavaScript file in the custom control, because this file already comes from the script references added via ScriptManager.

So, you don’t need the following code anymore:

Related Articles

Embedding JavaScript files in your custom controls

Incorporating ASP.NET AJAX into existing Custom Controls and JavaScript files