Creazione di uno script client personalizzato utilizzando Microsoft AJAX Library
Aggiornamento: novembre 2007
Le funzionalità AJAX di ASP.NET consentono di creare script client e di integrarli nelle applicazioni ASP.NET. Sono inclusi un sistema di tipi per ECMAScript (JavaScript) e le estensioni degli oggetti ECMAScript (JavaScript) esistenti per consentire loro di sfruttare le classi .NET Framework. In ASP.NET è inoltre incluso il controllo ScriptManager, che consente di gestire queste librerie di script e qualsiasi script personalizzato dell'applicazione.
Di seguito sono elencate le diverse sezioni di questo argomento:
Scenari
Utilizzo del sistema dei tipi
Utilizzo delle estensioni dei tipi di base JavaScript
Integrazione degli script client nelle applicazioni Web ASP.NET
Scenari
È possibile utilizzare le funzionalità di Microsoft AJAX Library per eseguire le attività seguenti:
Aggiungere al codice JavaScript funzionalità orientate agli oggetti per aumentare il riutilizzo, la flessibilità e la gestibilità del codice.
Utilizzare la reflection per esaminare in fase di esecuzione la struttura e i componenti degli script client.
Utilizzare le enumerazioni per fornire un'alternativa facilmente leggibile alle rappresentazioni in valori integer.
Utilizzare le estensioni dei tipi di base JavaScript per ridurre i tempi di sviluppo per le attività di scripting comuni.
Utilizzare le estensioni di debug e una funzionalità di analisi per eseguire debug più veloci e più informativi rispetto alle tecniche di debug tradizionali.
Utilizzo del sistema di tipi
Microsoft AJAX Library aggiunge un sistema di tipi ed estensioni per gli oggetti JavaScript al fine di fornire funzionalità orientate agli oggetti e utilizzate più di frequente che assomigliano alle funzionalità di .NET Framework. Tali funzionalità consentono di scrivere applicazioni ASP.NET con supporto AJAX in una modalità strutturata che migliora la gestibilità e semplifica l'aggiunta di funzioni e la disposizione di funzionalità su più livelli. Le estensioni°Microsoft AJAX Library aggiungono le funzionalità seguenti a JavaScript:
Classi
Spazi dei nomi
Ereditarietà
Interfacce
Enumerazioni
Reflection
La libreria fornisce anche funzioni di supporto per stringhe e matrici.
Classi, membri e spazi dei nomi
Microsoft AJAX Library include le classi base nonché gli oggetti e i componenti derivati da esse. Insieme, queste classi consentono di utilizzare un modello di programmazione orientato agli oggetti per la scrittura di script client.
La classe Type aggiunge alla programmazione JavaScript funzionalità orientate agli oggetti quali gli spazi dei nomi, le classi e l'ereditarietà. Qualsiasi oggetto JavaScript registrato mediante la classe Type ha automaticamente accesso a queste funzionalità. Nell'esempio seguente viene mostrato come utilizzare la classe Type per creare e registrare uno spazio dei nomi e una classe in un file JavaScript:
Type.registerNamespace("Demo");
Demo.Person = function(firstName, lastName, emailAddress) {
this._firstName = firstName;
this._lastName = lastName;
this._emailAddress = emailAddress;
}
Demo.Person.prototype = {
getFirstName: function() {
return this._firstName;
},
getLastName: function() {
return this._lastName;
},
getName: function() {
return this._firstName + ' ' + this._lastName;
},
dispose: function() {
alert('bye ' + this.getName());
}
}
Demo.Person.registerClass('Demo.Person', null, Sys.IDisposable);
// Notify ScriptManager that this is the end of the script.
if (typeof(Sys) !== 'undefined') Sys.Application.notifyScriptLoaded();
Le classi possono disporre di quattro tipi di membri: campi, proprietà, metodi ed eventi. I campi e le proprietà sono coppie nome/valore che descrivono le caratteristiche di un'istanza di una classe. I campi sono composti da tipi primitivi e vi si accede direttamente, come nell'esempio seguente:
myClassInstance.name="Fred"
Le proprietà possono rappresentare qualsiasi tipo o riferimento primitivo. Si accede ai valori delle proprietà con i metodi della funzione di accesso get e set. In Microsoft AJAX Library le funzioni di accesso get e set utilizzano per convenzione il prefisso "get_" o "set_" nel proprio nome. Ad esempio, per ottenere o impostare un valore per una proprietà quale cancel, si chiamano i metodi get_cancel o set_cancel.
Microsoft AJAX Library genera eventi in risposta alle azioni che si verificano durante il ciclo di vita di un'applicazione client AJAX. Microsoft AJAX Library fornisce anche una modalità standard per creare eventi personalizzati per i componenti client AJAX. Per ulteriori informazioni, vedere Creazione di eventi client personalizzati e Eventi del ciclo di vita del client AJAX.
Microsoft AJAX Library fornisce una modalità per registrare gli spazi dei nomi così da poter raggruppare le funzionalità comuni. Nell'esempio seguente viene mostrato come aggiungere una classe Person allo spazio dei nomi Demo utilizzando i metodi Type.registerNamespace e .registerClass.
Per attivare le funzionalità AJAX per una pagina Web ASP.NET, è necessario aggiungere alla pagina un controllo ScriptManager. Quando viene eseguito il rendering della pagina, i riferimenti appropriati degli script alle librerie script client AJAX vengono generati automaticamente. Nell'esempio riportato di seguito viene illustrata una pagina contenente un controllo ScriptManager:
<asp:ScriptManager ID="scriptManager" />
Nell'esempio riportato di seguito viene mostrato come registrare lo spazio dei nomi, creare la classe e registrarla.
Type.registerNamespace("Demo");
Demo.Person = function(firstName, lastName, emailAddress) {
this._firstName = firstName;
this._lastName = lastName;
this._emailAddress = emailAddress;
}
Demo.Person.prototype = {
getFirstName: function() {
return this._firstName;
},
getLastName: function() {
return this._lastName;
},
getName: function() {
return this._firstName + ' ' + this._lastName;
},
dispose: function() {
alert('bye ' + this.getName());
}
}
Demo.Person.registerClass('Demo.Person', null, Sys.IDisposable);
// Notify ScriptManager that this is the end of the script.
if (typeof(Sys) !== 'undefined') Sys.Application.notifyScriptLoaded();
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Namespace</title>
</head>
<body>
<form id="Main" >
<asp:ScriptManager ID="scriptManager" />
</form>
<div>
<p>This example creates an instance of the Person class
and puts it in the "Demo" namespace.</p>
<input id="Button1" value="Create Demo.Person"
type="button" onclick="return OnButton1Click()" />
</div>
<script type="text/javascript" src="Namespace.js"></script>
<script type="text/javascript" language="JavaScript">
function OnButton1Click()
{
var testPerson = new Demo.Person(
'John', 'Smith', 'john.smith@example.com');
alert(testPerson.getFirstName() + " " +
testPerson.getLastName() );
return false;
}
</script>
</body>
</html>
Modificatori di accesso
La maggior parte dei linguaggi di programmazione orientati agli oggetti include il concetto di modificatori di accesso, i quali consentono di specificare in quali contesti una classe o un membro è disponibile, ad esempio ai programmi esterni, alle classi interne dello stesso spazio dei nomi o solo all'interno di un blocco di codice specifico. Non esistono modificatori di accesso in JavaScript. Tuttavia, in Microsoft AJAX Library viene rispettata la convenzione secondo cui i membri con nomi che iniziano con il carattere di sottolineatura ("_") sono da considerare privati e non vi si può accedere dall'esterno della classe di cui fanno parte.
Ereditarietà
L'ereditarietà è la possibilità di una classe di derivare da un'altra classe. Una classe derivata eredita automaticamente tutti i campi, le proprietà, i metodi e gli eventi della classe base. Una classe derivata può aggiungere nuovi membri o eseguire l'override dei membri esistenti della classe base per modificarne il comportamento.
Nell'esempio seguente sono contenute due classi definite nello script: Person e Employee, dove Employee deriva da Person. Entrambi le classi illustrano l'utilizzo di campi privati ed entrambe hanno proprietà e metodi pubblici. Inoltre, Employee esegue l'override dell'implementazione toString della classe Person e utilizza le funzionalità della classe base.
Type.registerNamespace("Demo");
Demo.Person = function(firstName, lastName, emailAddress) {
this._firstName = firstName;
this._lastName = lastName;
this._emailAddress = emailAddress;
}
Demo.Person.prototype = {
getFirstName: function() {
return this._firstName;
},
getLastName: function() {
return this._lastName;
},
getEmailAddress: function() {
return this._emailAddress;
},
setEmailAddress: function(emailAddress) {
this._emailAddress = emailAddress;
},
getName: function() {
return this._firstName + ' ' + this._lastName;
},
dispose: function() {
alert('bye ' + this.getName());
},
sendMail: function() {
var emailAddress = this.getEmailAddress();
if (emailAddress.indexOf('@') < 0) {
emailAddress = emailAddress + '@example.com';
}
alert('Sending mail to ' + emailAddress + ' ...');
},
toString: function() {
return this.getName() + ' (' + this.getEmailAddress() + ')';
}
}
Demo.Person.registerClass('Demo.Person', null, Sys.IDisposable);
Demo.Employee = function(firstName, lastName, emailAddress, team, title) {
Demo.Employee.initializeBase(this, [firstName, lastName, emailAddress]);
this._team = team;
this._title = title;
}
Demo.Employee.prototype = {
getTeam: function() {
return this._team;
},
setTeam: function(team) {
this._team = team;
},
getTitle: function() {
return this._title;
},
setTitle: function(title) {
this._title = title;
},
toString: function() {
return Demo.Employee.callBaseMethod(this, 'toString') + '\r\n' + this.getTitle() + '\r\n' + this.getTeam();
}
}
Demo.Employee.registerClass('Demo.Employee', Demo.Person);
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Inheritance</title>
</head>
<body>
<form id="Main" >
<asp:ScriptManager ID="scriptManager" />
<script type="text/javascript" src="Inheritance.js"></script>
</form>
<h2>Inheritance</h2>
<p />
<div>
This file contains two classes defined in script: Person and Employee, where
Employee derives from Person.
<p />
Each class has private fields, and public properties and methods. In addition,
Employee overrides the toString implementation, and in doing so, it uses the
base class functionality.
<p />
This example puts the Person class in the "Demo" namespace.
<p />
</div>
<div>
<ul>
<li><a href="#" onclick="return OnTestNewClick()">Object Creation</a></li>
<li><a href="#" onclick="return OnTestDisposeClick()">Object Dispose</a></li>
<li><a href="#" onclick="return OnTestPrivatePropertyClick()">Public vs. Private Properties</a></li>
<li><a href="#" onclick="return OnTestInstanceMethodClick()">Instance Methods</a></li>
<li><a href="#" onclick="return OnTestOverrideMethodClick()">Overriden Methods</a></li>
<li><a href="#" onclick="return OnTestInstanceOfClick()">Instance Of Check</a></li>
</ul>
</div>
<script type="text/javascript" language="JavaScript">
function GetTestPerson()
{
return new Demo.Person('Jane', 'Doe', 'jane.doe@example.com');
}
function GetTestEmployee()
{
return new Demo.Employee('John', 'Doe', 'john.doe@example.com', 'Platform', 'Programmer');
}
function OnTestNewClick() {
var aPerson = GetTestPerson();
alert(aPerson.getFirstName());
alert(aPerson);
alert(Object.getType(aPerson).getName());
var testPerson = GetTestPerson();
alert(testPerson.getFirstName());
alert(testPerson);
return false;
}
function OnTestDisposeClick() {
var aPerson = GetTestEmployee();
alert(aPerson.getFirstName());
aPerson.dispose();
}
function OnTestPrivatePropertyClick() {
var aPerson = GetTestEmployee();
alert('aPerson._firstName = ' + aPerson._firstName);
alert('aPersona.getFirstName() = ' + aPerson.getFirstName());
return false;
}
function OnTestInstanceMethodClick() {
var aPerson = GetTestEmployee();
aPerson.sendMail('Hello', 'This is a test mail.');
return false;
}
function OnTestOverrideMethodClick() {
var testPerson = GetTestEmployee();
alert(testPerson);
return false;
}
function OnTestInstanceOfClick() {
var aPerson = GetTestEmployee();
if (Demo.Employee.isInstanceOfType(aPerson)) {
alert(aPerson.getName() + ' is an Employee instance.\r\nTitle property: ' + aPerson.getTitle());
}
return false;
}
</script>
</body>
</html>
Interfacce
Un'interfaccia definisce i requisiti di input e output delle classi che l'implementano. In tal modo una funzione può interagire con le classi che implementano la stessa interfaccia indipendentemente dalle altre funzionalità implementate dalla classe.
Nell'esempio seguente vengono definite una classe base Tree e un'interfaccia IFruitTree. Apple e Banana, due classi derivate, implementano l'interfaccia IFruitTree a differenza della classe Pine. Qualsiasi classe che implementa l'interfaccia IFruitTree verifica che il metodo bearFruit sia un membro di quella classe.
Type.registerNamespace("Demo.Trees");
Demo.Trees.IFruitTree = function() {}
Demo.Trees.IFruitTree.Prototype = {
bearFruit: function(){}
}
Demo.Trees.IFruitTree.registerInterface('Demo.Trees.IFruitTree');
Demo.Trees.Tree = function(name) {
this._name = name;
}
Demo.Trees.Tree.prototype = {
returnName: function() {
return this._name;
},
toStringCustom: function() {
return this.returnName();
},
makeLeaves: function() {}
}
Demo.Trees.Tree.registerClass('Demo.Trees.Tree');
Demo.Trees.FruitTree = function(name, description) {
Demo.Trees.FruitTree.initializeBase(this, [name]);
this._description = description;
}
Demo.Trees.FruitTree.prototype.bearFruit = function() {
return this._description;
}
Demo.Trees.FruitTree.registerClass('Demo.Trees.FruitTree', Demo.Trees.Tree, Demo.Trees.IFruitTree);
Demo.Trees.Apple = function() {
Demo.Trees.Apple.initializeBase(this, ['Apple', 'red and crunchy']);
}
Demo.Trees.Apple.prototype = {
makeLeaves: function() {
alert('Medium-sized and desiduous');
},
toStringCustom: function() {
return 'FruitTree ' + Demo.Trees.Apple.callBaseMethod(this, 'toStringCustom');
}
}
Demo.Trees.Apple.registerClass('Demo.Trees.Apple', Demo.Trees.FruitTree);
Demo.Trees.GreenApple = function() {
Demo.Trees.GreenApple.initializeBase(this);
// You must set the _description feild after initializeBase
// or you will get the base value.
this._description = 'green and sour';
}
Demo.Trees.GreenApple.prototype.toStringCustom = function() {
return Demo.Trees.GreenApple.callBaseMethod(this, 'toStringCustom') + ' ... its GreenApple!';
}
Demo.Trees.GreenApple.registerClass('Demo.Trees.GreenApple', Demo.Trees.Apple);
Demo.Trees.Banana = function(description) {
Demo.Trees.Banana.initializeBase(this, ['Banana', 'yellow and squishy']);
}
Demo.Trees.Banana.prototype.makeLeaves = function() {
alert('Big and green');
}
Demo.Trees.Banana.registerClass('Demo.Trees.Banana', Demo.Trees.FruitTree);
Demo.Trees.Pine = function() {
Demo.Trees.Pine.initializeBase(this, ['Pine']);
}
Demo.Trees.Pine.prototype.makeLeaves = function() {
alert('Needles in clusters');
}
Demo.Trees.Pine.registerClass('Demo.Trees.Pine', Demo.Trees.Tree);
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Interface</title>
</head>
<body>
<form id="Main" >
<asp:ScriptManager ID="scriptManager" />
</form>
<h2>Interface</h2>
<p />
<div>
This file contains a Tree base class, and an IFruitTree interface.
Apple and Banana, two derived classes implement that interface, whereas,
Pine does not implement that interface.
<p />
</div>
<script type="text/javascript" src="Interface.js"></script>
<div>
<ul>
<li><a href="#" onclick="return OnTestNewClick()">Object Creation</a></li>
<li><a href="#" onclick="return OnTestImplementsClick()">Implements Check</a></li>
<li><a href="#" onclick="return OnTestInterfaceMethodClick()">Call interface method</a></li>
</ul>
</div>
<script type="text/javascript" language="JavaScript">
function OnTestNewClick() {
var apple = new Demo.Trees.Apple('Apple');
alert(apple.returnName());
apple.makeLeaves();
return false;
}
function OnTestImplementsClick() {
var apple = new Demo.Trees.Apple();
if (Demo.Trees.IFruitTree.isImplementedBy(apple)) {
alert('Apple implements IFruitTree');
}
else {
alert('Apple does not implement IFruitTree');
}
var pine = new Demo.Trees.Pine();
if (Demo.Trees.IFruitTree.isImplementedBy(pine)) {
alert('Pine implements IFruitTree');
}
else {
alert('Pine does not implement IFruitTree');
}
return false;
}
function OnTestInterfaceMethodClick() {
var apple = new Demo.Trees.Apple();
ProcessTree(apple);
var pine = new Demo.Trees.Pine();
ProcessTree(pine);
var banana = new Demo.Trees.Banana();
ProcessTree(banana);
var g = new Demo.Trees.GreenApple();
ProcessTree(g);
return false;
}
function ProcessTree(tree) {
alert('Current Tree ' + tree.returnName());
alert(tree.toStringCustom());
if (Demo.Trees.IFruitTree.isImplementedBy(tree)) {
alert(tree.returnName() + ' implements IFruitTree; Fruit is ' + tree.bearFruit());
}
}
</script>
</body>
</html>
Enumerazioni
Un'enumerazione è una classe che contiene un insieme di costanti denominate di tipo integer. È possibile accedere ai valori come a proprietà, come nell'esempio riportato di seguito:
myObject.color = myColorEnum.red
Le enumerazioni forniscono un'alternativa facilmente leggibile alle rappresentazioni in valori integer. Per ulteriori informazioni sulle enumerazioni in Microsoft AJAX Library, vedere Metodo Type.registerEnum (ASP.NET AJAX).
Nell'esempio seguente viene definita un'enumerazione di colori denominati che rappresentano valori esadecimali.
Type.registerNamespace("Demo");
// Define an enumeration type and register it.
Demo.Color = function(){};
Demo.Color.prototype =
{
Red: 0xFF0000,
Blue: 0x0000FF,
Green: 0x00FF00,
White: 0xFFFFFF
}
Demo.Color.registerEnum("Demo.Color");
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Enumeration</title>
</head>
<body>
<form id="Main" >
<asp:ScriptManager ID="scriptManager" />
</form>
<div>
<p>This example creates an Enumeration of colors
and applies them to page background.</p>
<select id="ColorPicker"
onchange="ChangeColor(options[selectedIndex].value)">
<option value="Red" label="Red" />
<option value="Blue" label="Blue" />
<option value="Green" label="Green" />
<option value="White" label="White" />
</select>
</div>
<script type="text/javascript" src="Enumeration.js"></script>
<script type="text/javascript" language="JavaScript">
function ChangeColor(value)
{
document.body.bgColor = eval("Demo.Color." + value + ";");
}
</script>
</body>
</html>
Reflection
Per reflection si intende la capacità di esaminare in fase di esecuzione la struttura e i componenti di un programma. Le API che implementano la reflection sono estensioni della classe Type. Questi metodi consentono di raccogliere informazioni su un oggetto, ad esempio da quale oggetto eredita, se implementa una particolare interfaccia e se è un'istanza di una particolare classe.
Nell'esempio seguente vengono utilizzate le API di reflection per testare la classe GreenApple dell'interfaccia dell'esempio precedente.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Reflection</title>
</head>
<body>
<form id="Main" >
<asp:ScriptManager ID="scriptManager" />
</form>
<div>
<p>This example tests the Demo.Trees.GreenApple class
against various reflection APIs.</p>
<input id="Button1" value="Check Type"
type="button" onclick="return OnButton1Click()" />
<input id="Button2" value="Check Inheritance"
type="button" onclick="return OnButton2Click()" />
<input id="Button3" value="Check Interface"
type="button" onclick="return OnButton3Click()" />
</div>
<script type="text/javascript" src="Interface.js"></script>
<script type="text/javascript" language="JavaScript">
var g = new Demo.Trees.GreenApple();
var gt = Demo.Trees.GreenApple;
var a = new Array(
Demo.Trees.Apple,
Demo.Trees.Tree,
Demo.Trees.Pine,
Demo.Trees.IFruitTree,
Sys.IContainer);
function OnButton1Click()
{
for (var i = 0; i < a.length; i ++)
{
if (a[i].isInstanceOfType(g))
{
alert(gt.getName() + " is a " + a[i].getName() + ".");
}
else alert(gt.getName() + " is not a " + a[i].getName() + ".");
}
}
function OnButton2Click()
{
for (var i = 0; i < a.length; i ++)
{
if (gt.inheritsFrom(a[i]))
{
alert(gt.getName() + " inherits from " + a[i].getName() + ".");
}
else alert(gt.getName() + " does not inherit from " + a[i].getName() + ".");
}
}
function OnButton3Click()
{
for (var i = 0; i < a.length; i ++)
{
if (Type.isInterface(a[i]))
{
if (gt.implementsInterface(a[i]))
{
alert(gt.getName() + " implements the " + a[i].getName() + " interface.");
}
else alert(gt.getName() + " does not implement the " + a[i].getName() + " interface.");
}
else alert(a[i].getName() + " is not an interface.");
}
}
</script>
</body>
</html>
Utilizzo delle estensioni dei tipi di base JavaScript
Le estensioni dei tipi di base JavaScript forniscono funzionalità aggiuntive per tali tipi. Per ulteriori informazioni su queste estensioni, vedere i seguenti argomenti:
La classe Sys.Debug fornisce funzionalità di debug estese. Per ulteriori informazioni, vedere Cenni preliminari sul debug e sull'analisi delle applicazioni AJAX e i cenni preliminari sulla classe Sys.Debug.
Se si creano componenti basati su Microsoft AJAX Library, è possibile creare versioni di debug e versioni finali di file di script gestiti automaticamente dal controllo ScriptManager. È possibile identificare le versioni di debug dei file di script includendo ".debug" nel nome del file di script. Ad esempio, nei nomi di file di script seguenti vengono identificate le versioni di debug e definitive:
MyScript.js (definitiva)
MyScript.debug.js (debug)
Integrazione degli script client nelle applicazioni Web ASP.NET
Una pagina Web ASP.NET può accedere a un file di script facendovi riferimento in un blocco <script>, come illustrato nell'esempio seguente:
<script type="text/javascript" src="MyScript.js"></script>
Tuttavia, uno script richiamato in questo modo non può partecipare a un rendering di pagina parziale o accedere a determinati componenti di Microsoft AJAX Library. Per rendere disponibile un file di script per il rendering di pagina parziale in un'applicazione Web ASP.NET con supporto AJAX, è necessario che lo script venga registrato nel controllo ScriptManager della pagina. Per registrare un file di script, creare un oggetto ScriptReference che punta alla domanda di file e che lo aggiunge all'insieme Scripts. Nell'esempio seguente viene illustrato come effettuare tali operazioni nel markup:
<asp:ScriptManager ID="SMgr" >
<Scripts>
<asp:ScriptReference path="MyScript.js" />
</Scripts>
</asp:ScriptManager>
Affinché i file di script possano essere elaborati correttamente dal controllo ScriptManager, ogni file deve includere una chiamata al metodo Sys.Application.notifyScriptLoaded alla fine del file. Questa chiamata notifica all'applicazione che il caricamento del file è terminato. Nell'esempio riportato di seguito viene illustrato il codice da utilizzare a questo scopo:
if (typeof(Sys) !== 'undefined') Sys.Application.notifyScriptLoaded();
È anche possibile incorporare i file js come risorse negli assembly di codice gestito. Questa operazione può essere eseguita se si crea un controllo server ASP.NET con funzionalità AJAX implementato nello script client. Se lo script è incorporato in un assembly, non è necessario includervi un'istruzione di notifica. Inoltre non è necessario specificare un attributo path nel riferimento allo script. Tuttavia, è necessario fornire il nome dell'assembly senza l'estensione del nome file, come mostrato nell'esempio seguente:
<asp:ScriptManager ID="SMgr" >
<Scripts>
<asp:ScriptReference
Name="MyScript.js" Assembly="MyScriptAssembly"/>
</Scripts>
</asp:ScriptManager>
.gif "Nota") Nota: |
|---|
Questo scenario non è usuale per gli sviluppatori di pagine perché la maggior parte dei controlli con librerie di script incorporate fa riferimento agli script internamente. Per ulteriori informazioni, vedere la classe Procedura dettagliata: incorporamento di un file JavaScript come risorsa in un assembly. |
È inoltre possibile registrare gli script a livello di codice creando riferimenti agli script nel codice e aggiungendoli quindi all'insieme Scripts. Per ulteriori informazioni, vedere la classe Assegnazione dinamica dei riferimenti a uno script.
È possibile registrare gli script necessari per gli aggiornamenti di pagina parziale, utilizzare i metodi di registrazione del controllo ScriptManager. È possibile utilizzare questi metodi nei seguenti modi:
Per generare script client nel codice, compilare un blocco di script come stringa e passarlo al metodo RegisterClientScriptBlock.
Per aggiungere file script autonomi che non presentano dipendenze°di°Microsoft AJAX Library, utilizzare il metodoRegisterClientScriptInclude.
Per aggiungere file di script incorporati in un assembly, utilizzare il metodo RegisterClientScriptInclude.
Nota:Gli script registrati utilizzando questi metodi non hanno il supporto della localizzazione.
Per un elenco completo dei metodi di registrazione di script e del relativo utilizzo, vedere i cenni preliminari sul controllo ScriptManager.
Qualsiasi blocco di script o script in linea che si sta registrando deve essere nell'elemento <form> della pagina. In caso contrario, lo script non viene registrato dal controllo ScriptManager e non può accedere alle funzionalità ASP.NET AJAX. Per ulteriori informazioni, vedere Metodo Sys.Application.initialize.
Vedere anche
Attività
Concetti
Cenni preliminari sul rendering a pagina parziale
Cenni preliminari su ASP.NET AJAX
Script client nelle pagine Web ASP.NET
Creazione di controlli e componenti client