IdentifiantMot de passe
Mot de passe oublié ?Je m'inscris ! (gratuit)

FAQ ASP.NET/VB.NET

logo
Sommaire > Les datagrids > Affichage
        Comment ajouter des boutons image dans un DataGrid?
        Comment afficher une image dans un datagrid?
        Comment ajouter une scrollbar à un DataGrid?
        Comment lier une Css à un Datagrid ?
        Comment n'afficher que l'heure d'un champ type DateTime dans un datagrid ?
        Comment adapter la hauteur du datagrid en fonction du nombre de lignes à afficher ?
        Comment ajouter une colonne de webcontrols dans un datagrid ?
        Comment éviter d'indiquer le nombre de pages d'un DataGrid/GridView lorsque celui-ci est 1 ?


Comment ajouter des boutons image dans un DataGrid?
auteur : Louis-Guillaume Morand
Tout d'abord, il est nécessaire de mettre la colonne dans laquelle on souhaite mettre l'image en TemplateColumn. 

					<ItemTemplate>
					<asp:ImageButton id=imgNotValidated runat="server" Width="12px" ImageUrl="Resource/toCheck.gif" Height="12px" ImageAlign="Middle" CommandName="Item">
					</asp:ImageButton>

					<asp:Image id=imgValidated runat="server" Width="12px" ImageUrl="Resource/check.gif" Height="12px"  ImageAlign="Middle">
					</asp:Image>

					</ItemTemplate>
Le code du traitement dans le code behind: 

					...

Comment afficher une image dans un datagrid?
auteur : Louis-Guillaume Morand
Pour placer une image dans un datagrid il suffit d'utiliser une TemplateColumn et d'y placer l'image (par des composants html classiques ou par des composants aspnet): 

					<asp:DataGrid id="datagrid1" AutoGenerateColumns=false>
					<Columns>

					<asp:TemplateColumn>
					<ItemTemplate>
					<img scr='<%# Databinder.Eval(Container.DataItem,"Path") %>'>
					</ItemTemplate>
					</asp:TemplateColumn>

					</Columns>
					</asp:datagrid>
Il est bien entendu possible d'ouvrir une page lors d'un clic sur l'image par: 

					<asp:DataGrid id="datagrid1" AutoGenerateColumns=false>
					<Columns>
					<asp:TemplateColumn>

					<ItemTemplate>
					<a href='mon_url'>
					<img scr='<%# Databinder.Eval(Container.DataItem,"Path") %>'>
					</a>
					</ItemTemplate>
					</asp:TemplateColumn>

					</Columns>
					</asp:datagrid>

Comment ajouter une scrollbar à un DataGrid?
auteur : Didier Danse
Ceci est applicable à n'importe quel contrôle mais il s'agit du cas le plus fréquemment nécessaire.

En plaçant le DataGrid dans un div, il est possible de spécifier la hauteur affichable du DataGrid (plus exactement du div). Si celui-ci dépasse la taille du div, une scrollbar apparaît. 

					<div style="height:400; overflow:auto">
					<asp:DataGrid runat="server" ID="Dg">

					...
					</asp:DataGrid>
					</div>
lien : faq Comment adapter la hauteur du datagrid en fonction du nombre de lignes à afficher ?

Comment lier une Css à un Datagrid ?
auteur : David Pedehourcq
Le principe est le même pour lier un Datagrid à une Css que pour lier un Calendar à une Css : il faut lier chaque style définissant l'aspect du webcontrol à une classe Css. Pour éviter la redondance d'informations sur cette FAQ je vous renvois à la question : "Comment lier une Css à un Calendar ?"

lien : fr Comment lier un Calendar à une Css ?

Comment n'afficher que l'heure d'un champ type DateTime dans un datagrid ?
auteur : David Pedehourcq
Chaque colonne d'un datagrid à une propriété DataFormatString. Pour n'afficher que l'heure d'un champ DateTime la chainne de caractère à mettre pour la propriété DataFormatString est :
  • {0:HH:mm} : pour afficher les heures (de 0 à 24) et les minutes
  • {0:hh:mm} : pour afficher les heures (de 1 à 12) et le minutes
  • {0:HH:mm:s} : pour afficher les heures (de 0 à 24), les minutes et les secondes


Pour plus d'informations sur les formats personnalisés d'affichage de DateTime voir le site MSDN

lien : en Custom DateTime Format Strings
lien : fr Comment formater une date pour l'affichage ?

Comment adapter la hauteur du datagrid en fonction du nombre de lignes à afficher ?
auteur : David Pedehourcq
Cette question va paraitre simpliste pour certain, mais en parcourrant notre forum je me suis aperçu qu'on avait été pas mal à se prendre là tête la dessus. Quand on utilise un datagrid avec l'option AutoGenerateColumns="true" on a la hauteur du datagrid qui s'ajuste automatiquement en fonction du nombre de ligne qu'affiche la page.

Par contre, si on décide de spécifier manuellement les colonnes, et donc qu'on met AutoGenerateColumns="false", ce n'est plus la hauteur du datagrid qui s'adapte en fonction du nombre de lignes à afficher mais la hauteurs de lignes qui varie. On peut ainsi se retouer avec 2 ligne qui prennent toute la largeur du datagrid qui affiche normalement 10 lignes.

La solution à ce problème est ultra simple (encore fallait-il trouver) il suffit juste de ne pas préciser la hauteur (height) du datagrid !!!


Comment ajouter une colonne de webcontrols dans un datagrid ?
auteur : David Pedehourcq
Dans cet exemple nous allons ajouter une colonne de boutons : Dans le code de la page aspx : 

					<Columns>
					<asp:TemplateColumn>
					<HeaderStyle Width="600px"></HeaderStyle>
					<ItemTemplate>
					<asp:Button id="Button1" runat="server" Text="NotreBouton"></asp:Button>

					</ItemTemplate>
					</asp:TemplateColumn>
					<Columns>
Dans le <itemTemplate> on peut mettre n'importe quel webcontrol. Il y a aussi la balise <EditItemTemplate> dans laquelle on met le webcontrol affiché quand la cellule ou se trouve le <iItemTemplate> est en mode édition.

Si vous possédez Visual Studio, il y a encore plus simple : Allez dans le property builder du datagrid => Columns, et changez une boundsColumns en template columns à l'aide d'un lien en bas de la fenetre. Ensuite du sortez du property builder, faites un click droit sur le datagrid => édit template. Et la vous pouvez éditer la template column avec l'IDE en fesant du Drag & Drop.


Comment éviter d'indiquer le nombre de pages d'un DataGrid/GridView lorsque celui-ci est 1 ?
auteur : Didier Danse
La solution est assez simple. Il suffit de vérifier combien de données nous souhaitons afficher. Si le nombre de lignes est inférieur au nombre d'éléments à afficher par page, il ne reste qu'à interdire le paging, ce qui aura pour effet de cacher la ligne contenu le nombre de pages. 

					 
If DataSet1.Tables(0).Rows.Count <= dg.PageSize Then 
	dg.AllowPaging = False 
Else 
	dg.AllowPaging = True 
End If

Consultez les autres F.A.Q's

Les sources présentées sur cette page sont libres de droits et vous pouvez les utiliser à votre convenance. Par contre, la page de présentation constitue une œuvre intellectuelle protégée par les droits d'auteur. Copyright © 2007 Dotnet Developpez LLC. Tous droits réservés Developpez LLC. Aucune reproduction, même partielle, ne peut être faite de ce site ni de l'ensemble de son contenu : textes, documents et images sans l'autorisation expresse de Developpez LLC. Sinon vous encourez selon la loi jusqu'à trois ans de prison et jusqu'à 300 000 € de dommages et intérêts.