| 1 |
lars |
1 |
<com:TContent ID="body" >
|
|
|
2 |
|
|
|
3 |
<h1 id="2201">TClientScript</h1>
|
|
|
4 |
<com:DocLink ClassPath="System.Web.UI.WebControls.TClientScript" />
|
|
|
5 |
<h2 id="2202">Including Bundled Javascript Libraries in Prado</h2>
|
|
|
6 |
<p id="260238" class="block-content">
|
|
|
7 |
<tt>TClientScript</tt> allows Javascript code to be insert or linked to the
|
|
|
8 |
page template. PRADO is bundled with a large library of Javascript functionality
|
|
|
9 |
including effects, AJAX, basic event handlers, and many others. The bundled
|
|
|
10 |
Javascript libraries can be linked to the current page template using the
|
|
|
11 |
<tt>PradoScripts</tt> property. Multiple bundled Javascript libraries
|
|
|
12 |
can be specified using comma delimited string of the name of Javascript library
|
|
|
13 |
to include on the page. For following example will include the "ajax" and "effects" library.
|
|
|
14 |
</p>
|
|
|
15 |
<com:TTextHighlighter Language="prado" CssClass="source block-content" id="code_260101">
|
|
|
16 |
<com:TClientScript PradoScripts="ajax, effects" />
|
|
|
17 |
</com:TTextHighlighter>
|
|
|
18 |
|
|
|
19 |
<p id="260239" class="block-content">
|
|
|
20 |
The available bundled libraries included in Prado are</p>
|
|
|
21 |
<ul id="u1" class="block-content">
|
|
|
22 |
<li><tt>prado</tt> : basic prado javascript framework based on Prototype</li>
|
|
|
23 |
<li><tt>effects</tt> : visual effects from script.aculo.us</li>
|
|
|
24 |
<li><tt>ajax</tt> : ajax and callback related based on Prototype</li>
|
|
|
25 |
<li><tt>validator</tt> : validation</li>
|
|
|
26 |
<li><tt>logger</tt> : javascript logger and object browser</li>
|
|
|
27 |
<li><tt>datepicker</tt> : datepicker</li>
|
|
|
28 |
<li><tt>colorpicker</tt> : colorpicker</li>
|
|
|
29 |
</ul>
|
|
|
30 |
<p id="260240" class="block-content">
|
|
|
31 |
Many of the libraries, such as <tt>validator</tt> and <tt>datepicker</tt> will automatically
|
|
|
32 |
when controls that uses these libraries are visible on the page. For example, all the
|
|
|
33 |
<a href="?page=Controls.Validation">validators</a>
|
|
|
34 |
if they have their <tt>EnableClientScript</tt> set to true will include both the <tt>prado</tt>
|
|
|
35 |
and <tt>validator</tt> javascript libraries.
|
|
|
36 |
The dependencies for each library are automatically resolved. That is,
|
|
|
37 |
specifying, say the "ajax", will also include the "prado" library.</p>
|
|
|
38 |
|
|
|
39 |
<h2 id="2203">Including Custom Javascript Files</h2>
|
|
|
40 |
<p id="260241" class="block-content">Custom Javascript files can be register using the <tt>ScriptUrl</tt> property.
|
|
|
41 |
The following example includes the Javascript file "test.js" to the page. In this case, the file
|
|
|
42 |
"test.js" is relative the current template you are using. Since the property value is
|
|
|
43 |
<a href="?page=Configurations.Templates3">dynamic asset tag</a>, the file "test.js" will be published
|
|
|
44 |
automatically, that is, the file will be copied to the assets directory if necessary.
|
|
|
45 |
</p>
|
|
|
46 |
<com:TTextHighlighter Language="prado" CssClass="source block-content" id="code_260102">
|
|
|
47 |
<com:TClientScript ScriptUrl=<%~ test.js %> />
|
|
|
48 |
</com:TTextHighlighter>
|
|
|
49 |
<p id="260242" class="block-content">You can include Javascript files from other servers by specifying the full URL string in
|
|
|
50 |
the <tt>ScriptUrl</tt> property.</p>
|
|
|
51 |
|
|
|
52 |
<h2 id="2204">Including Custom Javascript Code Blocks</h2>
|
|
|
53 |
<p id="260243" class="block-content"> Any content within the <tt>TClientScript</tt> control tag will be considered as
|
|
|
54 |
Javascript code and will be rendered where it is declared.</p>
|
|
|
55 |
|
|
|
56 |
<div class="last-modified">$Id: ClientScript.page 1846 2007-04-07 10:35:16Z wei $</div></com:TContent>
|