Création d'un script client personnalisé à l'aide de Microsoft AJAX Library
Mise à jour : novembre 2007
Les fonctionnalités AJAX d'ASP.NET vous permettent de créer un script client et de l'intégrer dans des applications ASP.NET. Elles incluent un système de type pour ECMAScript (JavaScript) et des extensions aux objets ECMAScript (JavaScript) existants pour leur attribuer la richesse de classes du .NET Framework. ASP.NET inclut également le contrôle ScriptManager pour gérer ces bibliothèques de scripts et tout script personnalisé dans votre application.
Cette rubrique contient les sections suivantes :
Scénarios
Utilisation du système de type
Utilisation d'extensions aux types de base JavaScript
Intégration d'un script client dans des applications Web ASP.NET
Scénarios
Vous pouvez utiliser les fonctionnalités de Microsoft AJAX Library lorsque vous souhaitez effectuer les opérations suivantes :
Ajouter des fonctions orientées objet à votre code Javascript pour augmenter la réutilisation, la souplesse et la facilité de maintenance du code.
Utiliser la réflexion pour examiner la structure et les composants du script client au moment de l'exécution.
Utiliser des énumérations pour fournir une alternative facilement lisible par rapport aux représentations sous forme d'entier.
Utiliser des extensions aux types de base JavaScript pour réduire le temps de développement requis pour les tâches courantes de script.
Utiliser des extensions de débogage et une fonctionnalité de trace pour obtenir un débogage plus rapide et plus informatif qu'avec les techniques de débogage JavaScript traditionnelles.
Utilisation du système de type
Microsoft AJAX Library ajoute un système de type et des extensions aux objets JavaScript pour fournir des fonctionnalités orientées objet fréquemment utilisées qui ressemblent aux fonctionnalités du .NET Framework. Elles vous permettent d'écrire des applications ASP.NET AJAX d'une façon structurée qui améliore la maintenance, simplifie l'ajout de fonctionnalités et facilite l'organisation en couches des fonctionnalités. Les extensions Microsoft AJAX Library ajoutent les fonctions suivantes à JavaScript :
Classes
Espaces de noms
Héritage
Interfaces
Énumérations
Réflexion
La bibliothèque fournit également des fonctions d'assistance pour les chaînes et les tableaux.
Classes, membres et espaces de noms
Microsoft AJAX Library inclut des classes de base, des objets et des composants qui dérivent de ces derniers. Ces classes vous permettent toutes d'utiliser un modèle de programmation orientée objet pour écrire le script client.
La classe Type ajoute des fonctionnalités orientées objet telles que des espaces de noms, des classes et un héritage à la programmation JavaScript. Tout objet JavaScript enregistré à l'aide de la classe Type a automatiquement accès à ces fonctionnalités. L'exemple suivant indique comment utiliser la classe Type pour créer et enregistrer un espace de noms et une classe dans un fichier 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();
Les classes peuvent comprendre quatre types de membres : les champs, les propriétés, les méthodes et les événements. Les champs et les propriétés sont des paires nom/valeur qui décrivent les caractéristiques de l'instance d'une classe. Les champs sont composés de types primitifs et vous pouvez y accéder directement, comme dans l'exemple suivant :
myClassInstance.name="Fred"
Les propriétés peuvent représenter tout type primitif ou référence. Vous accédez aux valeurs de propriété via les méthodes d'accesseur get et set. Dans Microsoft AJAX Library, les accesseurs get et set sont des fonctions qui, par convention, utilisent le préfixe "get_" ou "set_" dans leur nom. Par exemple, vous appelez les méthodes get_cancel ou set_cancel pour obtenir ou définir une valeur pour une propriété telle que cancel.
Microsoft AJAX Library déclenche des événements en réponse aux actions qui se produisent pendant le cycle de vie d'une application cliente AJAX. Microsoft AJAX Library vous offre également un moyen standard pour créer des événements personnalisés pour des composants clients AJAX. Pour plus d'informations, consultez Création d'événements clients personnalisés et Événements de cycle de vie client AJAX.
Microsoft AJAX Library vous permet d'enregistrer des espaces de noms de sorte que vous puissiez regrouper des fonctionnalités communes. L'exemple suivant indique comment ajouter une classe Person à l'espace de noms Demo à l'aide des méthodes Type.registerNamespace et registerClass.
Pour activer la fonctionnalité AJAX pour une page Web ASP.NET, vous devez ajouter un contrôle ScriptManager à la page. Lorsque la page s'affiche, les références de script appropriées aux bibliothèques de script client AJAX sont générées automatiquement. L'exemple suivant présente une page contenant un contrôle ScriptManager.
<asp:ScriptManager ID="scriptManager" />
L'exemple suivant indique comment enregistrer l'espace de noms et créer puis enregistrer la classe.
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>
Modificateurs d'accès
La plupart des langages de programmation orientés objet incluent le concept de modificateurs d'accès. Ceux-ci vous permettent de spécifier dans quels contextes une classe ou un membre est accessible à des programmes extérieurs, des classes internes dans un même espace de noms, ou uniquement dans un bloc de code spécifique, par exemple. Il n'existe pas de modificateurs d'accès dans JavaScript. Toutefois, Microsoft AJAX Library respecte la convention selon laquelle les membres dont les noms démarrent par un trait de soulignement (« _ ») sont considérés comme privés et ne sont pas accessibles en dehors de la classe à laquelle ils appartiennent.
Héritage
L'héritage correspond à la capacité, pour une classe, à dériver d'une autre classe. Une classe dérivée hérite automatiquement de tous les champs, propriétés, méthodes et événements de sa classe de base. Une classe dérivée peut ajouter de nouveaux membres ou remplacer des membres existants de la classe de base pour modifier leur comportement.
L'exemple suivant contient deux classes définies dans le script : Person et Employee, où Employee dérive de Person. Ces deux classes illustrent l'utilisation de champs privés et possèdent des propriétés et des méthodes publiques. De plus, Employee remplace l'implémentation toString de la classe Person et utilise les fonctionnalités de la classe de 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>
Interfaces
Une interface définit les spécifications d'entrée et de sortie des classes qui l'implémentent. Cela permet à une fonction d'interagir avec les classes qui implémentent la même interface, indépendamment des autres fonctionnalités implémentées par la classe.
L'exemple suivant définit une classe de base Tree et une interface IFruitTree. Apple et Banana, deux classes dérivées, implémentent l'interface IFruitTree, à la différence de la classe Pine. Toute classe qui implémente l'interface IFruitTree vérifie qu'une méthode bearFruit est membre de cette 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>
Énumérations
Une énumération est une classe qui contient un jeu de constantes entières désignées. Vous pouvez accéder aux valeurs (telles que les propriétés), comme dans l'exemple suivant :
myObject.color = myColorEnum.red
Les énumérations offrent une alternative facilement lisible par rapport aux représentations sous forme d'entier. Pour plus d'informations sur les énumérations dans Microsoft AJAX Library, consultez Type.registerEnum, méthode (ASP.NET AJAX).
L'exemple suivant définit une énumération de couleurs nommées qui représentent des valeurs hexadécimales.
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>
Réflexion
La réflexion est la capacité à examiner la structure et les composants d'un programme au moment de l'exécution. Les API qui implémentent la réflexion sont des extensions de la classe Type. Ces méthodes vous permettent de rassembler des informations à propos d'un objet, telles que l'élément depuis lequel il dérive, s'il implémente une interface particulière ou s'il s'agit de l'instance d'une classe particulière.
L'exemple suivant utilise des API de réflexion pour tester la classe GreenApple de l'exemple d'interface précédent.
<!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>
Utilisation d'extensions aux types de base JavaScript
Les extensions aux types de base JavaScript fournissent des fonctionnalités supplémentaires pour ces types. Pour plus d'informations sur ces extensions, consultez les rubriques suivantes :
La classe Sys.Debug fournit des fonctions de débogage étendues. Pour plus d'informations, consultez Vue d'ensemble du débogage et du traçage des applications AJAX et la vue d'ensemble de la classe Sys.Debug.
Si vous créez des composants basés sur Microsoft AJAX Library, vous pouvez créer une version Debug et une version Release des fichiers de script gérés automatiquement par le contrôle ScriptManager. Vous pouvez identifier des versions Debug de fichiers de script en incluant ".debug" dans le nom de fichier de script. Par exemple, les noms de fichier de script suivants identifient la version commerciale et la version Debug d'un fichier :
MyScript.js (version commerciale)
MyScript.debug.js (version Debug)
Intégration d'un script client dans des applications Web ASP.NET
Toute page Web ASP.NET peut accéder à un fichier de script en y faisant référence dans un bloc <script>, comme dans l'exemple suivant :
<script type="text/javascript" src="MyScript.js"></script>
Toutefois, un script appelé de cette manière ne peut pas participer au rendu de page partielle ou accéder à certains composants de Microsoft AJAX Library. Pour permettre à un fichier de script d'effectuer un rendu de page partielle dans une application Web ASP.NET AJAX, le script doit être enregistré dans la page avec le contrôle ScriptManager. Pour enregistrer un fichier de script, créez un objet ScriptReference qui pointe sur le fichier en question et l'ajoute à la collection Scripts. L'exemple ci-après indique comment effectuer les opérations suivantes dans le balisage :
<asp:ScriptManager ID="SMgr" >
<Scripts>
<asp:ScriptReference path="MyScript.js" />
</Scripts>
</asp:ScriptManager>
Chaque fichier de script devant être traité correctement par le contrôle ScriptManager doit inclure en fin de fichier un appel à la méthode Sys.Application.notifyScriptLoaded. Cet appel indique à l'application que le chargement du fichier est terminé. L'exemple suivant indique le code à utiliser à cette fin.
if (typeof(Sys) !== 'undefined') Sys.Application.notifyScriptLoaded();
Vous pouvez également incorporer des fichiers .js en tant que ressources dans les assemblys de code managé. (Vous pouvez effectuer cette opération si vous créez un contrôle serveur ASP.NET avec des fonctionnalités AJAX implémentées dans le script client.) Si votre script est incorporé dans un assembly, vous n'avez pas besoin d'inclure d'instruction de notification dans le script. De plus, vous n'avez pas besoin de spécifier d'attribut path dans la référence de script. Toutefois, vous devez fournir le nom de l'assembly sans l'extension de nom de fichier, comme l'illustre l'exemple suivant :
<asp:ScriptManager ID="SMgr" >
<Scripts>
<asp:ScriptReference
Name="MyScript.js" Assembly="MyScriptAssembly"/>
</Scripts>
</asp:ScriptManager>
.gif "Remarque") Remarque : |
|---|
Ce scénario n'est pas commun aux développeurs de pages, car la plupart des contrôles contenant des bibliothèques de scripts incorporés font référence à leurs scripts en interne. Pour plus d'informations, consultez Procédure pas à pas : incorporation d'un fichier JavaScript en tant que ressource dans un assembly. |
Vous pouvez également enregistrer des scripts par programme en créant des références de script dans le code puis en les ajoutant à la collection Scripts. Pour plus d'informations, consultez Assignation dynamique de références de script.
Vous pouvez enregistrer des scripts requis pour les mises à jour de pages partielles en utilisant les méthodes d'inscription du contrôle ScriptManager. Vous pouvez utiliser ces méthodes des façons suivantes :
Pour générer le script client dans le code, générez un bloc de script en tant que chaîne et passez-le à la méthode RegisterClientScriptBlock.
Pour ajouter des fichiers de script autonomes qui n'ont pas de dépendances Microsoft AJAX Library, utilisez la méthode RegisterClientScriptInclude.
Pour ajouter des fichiers de script incorporés dans un assembly, utilisez la méthode RegisterClientScriptInclude.
Remarque :Les scripts enregistrés à l'aide de ces méthodes ne prennent pas en charge la localisation.
Pour obtenir une liste complète de méthodes d'inscription de script et de leurs utilisations, consultez la vue d'ensemble du contrôle ScriptManager.
Tout bloc de script ou script inline que vous enregistrez doit figurer dans l'élément <form> de la page. Sinon, le script n'est pas enregistré avec le contrôle ScriptManager et ne peut pas accéder aux fonctionnalités ASP.NET AJAX. Pour plus d'informations, consultez Sys.Application.initialize, méthode.
Voir aussi
Tâches
Concepts
Vue d'ensemble du rendu de page partielle
Script client dans les pages Web ASP.NET
Création de composants et de contrôles clients