Home / AJAX

HOW TO Include both Static and Dynamic Scripts

RSS
Modified on 2009/12/04 17:34 by Stephen Walther Categorized as Uncategorized
The ASP.NET Ajax Library provides a flexible way to work with scripts used in an Ajax application. Although the Script Loader provides a simple and performant way to load scripts and their dependencies, there may be scenarios where some scripts need to be loaded using the standard <script> element while other scripts need to be loaded using Sys.require. For example, a different version of a ASP.NET Ajax Library script may need to be loaded by an Ajax application. The <script> element provides a simple way to load a different version of a script (or load it from a different location) and Sys.require can be used to load standard scripts supported by the Script Loader.

Both static and dynamic scripts can be loaded as shown next:


<script type="text/javascript" src="/Scripts/AjaxLibrary/Start.js"></script> <!-- Load a different version of the globalization script than the Script Loader normally loads --> <script type="text/javascript" src="/Scripts/AjaxLibraryOld/MicrosoftAjaxGlobalization1.5.js"></script> <script type="text/javascript" src="/Scripts/Calculations.js"></script>

<script type="text/javascript">

Sys.require([Sys.scripts.ApplicationServices, Sys.scripts.jQuery], function() { //Scripts loaded });

</script>

What's the difference between the different script loading options? Using the <script> element results in serial loading of scripts (depending upon the browser) but provides the benefit of full intellisense in Visual Studio. Using Sys.require allows scripts to be loaded in parallel (providing enhanced performance) and loads behaviors and plugins defined in a given script. Sys.require also handles loading any script dependencies required by a script whereas dependencies would need to be defined in order (from top to bottom) when using the <script> element to define static scripts.