ASP:IMAGEBUTTON |
ASP : Bouton d'image |
|---|---|
| ASP.NET | |
Syntaxe
|
<asp:ImageButton paramètres> </asp:ImageButton> |
Paramètres
| Paramètre | Description | ||
|---|---|---|---|
| AccessKey=valeur | Ce paramètre de balise permet d'indiquer un touche de raccourci à associer avec cette balise. | ||
| AlternateText=valeur | Ce paramètre de balise permet d'indiquer un texte alternatif lorsque l'image n'est pas affiché. | ||
| BackColor=valeur | Ce paramètre permet d'indiquer la couleur d'arrière plan de la balise. | ||
| BorderColor=valeur | Ce paramètre permet d'indiquer la couleur de bordure de la balise. | ||
| BorderStyle=valeur | Ce paramètre permet d'indiquer le style de bordure de la balise : NotSet, None, Dotted, Dashed, Solid, Double, Groove, Ridge, Inset ou Outset. | ||
| BorderWidth=valeur | Ce paramètre permet d'indiquer la largeur de la bordure de la balise. | ||
| CommandArgument=valeur | Ce paramètre permet d'indiquer les paramètres de commande. | ||
| CommandName=valeur | Ce paramètre permet d'indiquer le nom de la commande. | ||
| CssClass=valeur | Ce paramètre permet d'indiquer la classe de feuille de style CSS de la balise. | ||
| DescriptionUrl=valeur | Ce paramètre permet d'indiquer un lien URL vers une description. | ||
| Enabled=valeur | Ce paramètre permet d'indiquer si la balise doit être active ou non : | ||
| Constante | Description | ||
| "False" | Cette constante permet d'indiquer que la balise n'est pas active. | ||
| "True" | Cette constante permet d'indiquer que la balise n'est pas active. | ||
| EnableTheming=valeur | Ce paramètre permet d'indiquer si le thème de la balise doit être affiché ou non : | ||
| Constante | Description | ||
| "False" | Cette constante permet d'indiquer que le thème de la balise n'est pas affiché. | ||
| "True" | Cette constante permet d'indiquer que le thème de la balise est affiché. | ||
| EnableViewState=valeur | Ce paramètre permet d'indiquer si le ViewState de la balise doit être activé ou non : | ||
| Constante | Description | ||
| "False" | Cette constante permet d'indiquer que le ViewState de la balise n'est pas actif. | ||
| "True" | Cette constante permet d'indiquer que le ViewState de la balise est actif. | ||
| ForeColor=valeur | Ce paramètre permet d'indiquer la couleur de premier plan de la balise. | ||
| Height=valeur | Ce paramètre permet d'indiquer la hauteur de la balise. | ||
| ID=valeur | Ce paramètre permet d'indiquer l'identificateur de la balise. | ||
| ImageAlign=alignement | Ce paramètre de balise permet de définir le type d'alignement horizontal que la cellule appliquera par défaut : | ||
| Constante | Description | ||
| "AbsBottom" | Cette constante indique que l'alignement absolue sera effectué à partir du bas | ||
| "AbsMiddle" | Cette constante indique que l'alignement absolue sera effectué à partir du milieu | ||
| "Baseline" | Cette constante indique que l'alignement sera effectué à partir de la ligne de base | ||
| "Bottom" | Cette constante indique que l'alignement sera effectué à partir du bas | ||
| "Left" | Cette constante indique que l'alignement sera effectuer à partir de la gauche | ||
| "Middle" | Cette constante indique que l'alignement sera effectué à partir du milieu | ||
| "NotSet" | Cette constante indique qu'il n'y a pas d'alignement | ||
| "Right" | Cette constante indique que l'alignement sera effectuer à partir de la droite | ||
| "TextTop" | Cette constante indique que l'alignement texte sera effectuer à partir du haut | ||
| "Top" | Cette constante indique que l'alignement sera effectuer à partir du haut | ||
| ImageUrl=valeur | Ce paramètre permet d'indiquer un lien URL vers l'image. | ||
| OnClick=valeur | Ce paramètre permet d'indiquer le gestionnaire d'événement lorsqu'un clic est effectué. | ||
| OnClientClick=valeur | Ce paramètre permet d'indiquer le gestionnaire d'événement lorsqu'un client effectue un clic. | ||
| OnCommand=valeur | Ce paramètre permet d'indiquer le gestionnaire d'événement lors d'une commande. | ||
| OnDataBinding=valeur | Ce paramètre permet d'indiquer le gestionnaire d'événement de DataBinding. | ||
| OnDisposed=valeur | Ce paramètre permet d'indiquer le gestionnaire d'événement de disposition. | ||
| OnInit=valeur | Ce paramètre permet d'indiquer le gestionnaire d'événement d'initialisation. | ||
| OnLoad=valeur | Ce paramètre permet d'indiquer le gestionnaire d'événement de chargement. | ||
| OnPreRender=valeur | Ce paramètre permet d'indiquer le gestionnaire d'événement de pré-rendu. | ||
| OnUnload=valeur | Ce paramètre permet d'indiquer le gestionnaire d'événement de déchargement. | ||
| PostBackUrl=valeur | Ce paramètre de balise permet d'indiquer l'URL où doit être soumis le résultat de l'action du bouton. | ||
| runat=valeur | Ce paramètre permet d'indiquer où doit être exécuté la balise : | ||
| Constante | Description | ||
| "server" | Cette constante permet d'indiquer qu'il faut exécuter la balise du côté serveur. | ||
| SkinID=valeur | Ce paramètre permet d'indiquer l'identificateur de Skin. | ||
| Style=valeur | Ce paramètre de balise permet d'indiquer des paramètres de feuille de style associé avec cette balise. | ||
| TabIndex=valeur | Ce paramètre de balise permet d'indiquer l'ordre de sélection des champs et éléments dans un formulaire. | ||
| ToolTip=valeur | Ce paramètre de balise permet d'indiquer l'info-bulle. | ||
| ValidationGroup=valeur | Ce paramètre de balise permet d'indiquer le groupe de validation. | ||
| Visible=valeur | Ce paramètre permet d'indiquer si la balise doit être affiché ou non : | ||
| Constante | Description | ||
| "False" | Cette constante permet d'indiquer que la balise n'est pas affiché. | ||
| "True" | Cette constante permet d'indiquer que la balise est affiché. | ||
| Width=valeur | Ce paramètre de balise permet d'indiquer la largeur de la balise. | ||
Description
Cette balise permet de définir un bouton d'action utilisateur définit à partir d'une image.
Remarques
- Le contrôle <asp:ImageButton> combine les fonctions d'un bouton et d'une image. Il permet à l'utilisateur de cliquer sur une image comme s'il s'agissait d'un bouton traditionnel ASP.NET.
- La propriété principale ImageUrl permet de définir le chemin de l'image à afficher. Cette image peut être un fichier local du projet ou une image externe accessible par une URL complète.
- Comme pour un bouton standard, le clic sur un ImageButton déclenche un événement côté serveur (Click). Cela permet de lancer facilement une action ou un traitement personnalisé à partir de l'interface utilisateur.
- Le contrôle doit avoir l'attribut runat="server" pour pouvoir être exploité côté serveur. Cela permet d'accéder à toutes ses propriétés dans le code-behind et de réagir à son interaction.
- Lorsqu'un ImageButton est cliqué, il envoie automatiquement les coordonnées du clic (x, y) sur l'image, via les paramètres Click ou dans la requête. Cela peut être utile pour des interfaces interactives ou graphiques.
- La propriété CommandName peut être utilisée pour définir une commande spécifique (comme "edit" ou "delete"), ce qui est pratique lorsqu'il y a plusieurs boutons dans un Repeater ou un GridView.
- Le ImageButton peut également transporter des données via la propriété CommandArgument. Cela permet, par exemple, d'identifier l'élément sur lequel l'utilisateur a cliqué, comme un ID ou un code.
- La propriété AlternateText permet d'ajouter un texte alternatif à l'image, ce qui est recommandé pour l'accessibilité et pour les navigateurs ne chargeant pas les images.
- Il est possible de modifier l'apparence du ImageButton à l'aide de CSS en assignant une classe via la propriété CssClass. Cela permet de gérer la taille, les marges, les effets visuels au survol,...
- Pour rendre l'image plus interactive, on peut utiliser JavaScript ou des attributs comme onmouseover et onmouseout afin de changer l'image à la volée ou d'afficher une info-bulle.
- Dans des interfaces dynamiques, le ImageButton est très souvent utilisé pour représenter des actions visuelles : par exemple, une icône de poubelle pour supprimer, un crayon pour modifier, ou une loupe pour voir les détails.
- Il est important de veiller à ce que l'image utilisée soit optimisée et bien dimensionnée. Un ImageButton trop lourd ou trop grand peut ralentir l'interface ou nuire à l'ergonomie.
- Ce contrôle peut être utilisé dans des grilles de données (DataList, Repeater, GridView) pour associer une action à chaque ligne avec un rendu plus graphique qu'un simple bouton texte.
- Comme pour les autres contrôles serveurs, on peut rendre le ImageButton conditionnel via la propriété Visible. Cela permet de ne l'afficher que dans certains cas ou pour certains utilisateurs.
- Le contrôle est compatible avec AJAX et UpdatePanel, ce qui permet de gérer les clics sur l'image sans recharger toute la page. C'est utile pour les interfaces modernes réactives.
Exemple
Voici un exemple permettant d'afficher un bouton d'image :
- <%@ Page Language="vb" %>
- <!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">
- <body>
- <form id="MonFormulaire" runat="server">
- <asp:ImageButton id="ImageButton1" runat="server" ImageURL="http://www.gladir.com/IMAGES/logo.gif" ToolTip="Logo"></asp:ImageButton>
- </form>
- </body>
- </html>
on obtiendra le résultat semblable suivant :
Voir également
Articles - Les géants de l'informatique - Microsoft
Dernière mise à jour : Samedi, le 31 août 2017