Un bouton Image dynamique dans un GridView

Version imprimable

02/06/2008, 10h36
zooffy

Un bouton Image dynamique dans un GridView
Salut

J'ai monté un GridView dans ma page et je fabrique les colonnes de manière dynamique.
L'une de mes colonnes est fabriquée comme cela :
Code:

1 2 3 4 5 6 7 8 9 Dim actif As New ButtonField With actif .HeaderText = "Actif" .ButtonType = ButtonType.Image .ImageUrl = "~/image/0.png" .CommandName = "Actif" End With gvCampagne.Columns.Add(actif)
Maintenant, je voudrais que l'image soit dynmaique selon la donnée qui est contenue dans un champ. Ce champ est censé contenir un chiffre (0 ou 1 pour l'instant) et ce chiffre correspond au nom de l'image que je voudrais voir appraitre.

Je patauge pas mal car je ne trouve pas le moyen de le faire. Soit j'arrive à afficher l'image en prenant un ImageField, mais là je n'ai plus accés au commandes du GridView, soit je reste sur le ButtonField mais là, je n'arrive pas à changer l'image à la volée.

Pouvez vous m'aider ?
02/06/2008, 10h55
predalpha

Salut Zooffy,

essaies peut-être en utilisant l'evenement rowdatabound du gridview ou un truc du genre. Tu pourrais ainsi contrôler la valeur et mettre ce que tu veux.
02/06/2008, 11h46
nah666

un ImageButton dans un templateField ?

Tu change ton image dans ton rowdatabound

et ensuite tu passe par ton rowCommand
02/06/2008, 12h25
zooffy

Merci pour votre aide.

Je suis maintenant confronté à un souci que je ne comprends pas.
J'ai tenté d'utiliser le RowDataBound (option de predalpha) mais il me lance le message suivant :

Citation:

La colonne "Id_Campagne" n'appartient aps à la table DefaultView

Ce champ est le premier de ma réquête qui sert à nourri le GridView. J'ai placé un SqlDataSource dans le code HTML avec un lien DataSourceId sur leGridView. Je ne comprends pas ce qu'il dit par rapport à cette fameuse table DefaultView.
02/06/2008, 12h32
zooffy

Sur l'option TemplateField, je rencontre un autre souci, différent.
Je ne réussi pas à le mettre en oeuvre à partir du CodeBehind. Je en trouve pas le moyen d'ajouter un contrôle dedans et la MSDN est muette là dessus, les seuls exemples qu'il donne sont côté HTML.
02/06/2008, 13h30
predalpha

tu peux nous balancer un peu plus de code ?
(contrôle aussi les rowtypes)

Oauh, tu veux du code ????
Ben tu va pas être déçu.....................

Alors côté HTML :
J'ai tout mis, parce que ça mange pas de pain.

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
 
<%@ Control Language="VB" AutoEventWireup="false" CodeFile="Campagne.ascx.vb" Inherits="OutilWeb_ContenuWeb_Campagne" %>
<asp:SqlDataSource ID="sdsGvCampagne" runat="server" 
	DataSourceMode="DataSet"
	ConnectionString="<%$ ConnectionStrings:CS %>">
</asp:SqlDataSource>
<asp:DropDownList ID="lstRegie" runat="server" AutoPostBack="true"></asp:DropDownList>
<asp:DropDownList ID="lstAnnonceur" runat="server" AutoPostBack="true"></asp:DropDownList>
<br /><br /><br />
<ajax:UpdatePanel ID="upCampagne" runat="server" UpdateMode="Always" RenderMode="Inline">
	<Triggers>
		<ajax:AsyncPostBackTrigger ControlID="gvCampagne" EventName="RowCommand" />
		<ajax:AsyncPostBackTrigger ControlID="gvCampagne" EventName="PageIndexChanged" />
		<ajax:AsyncPostBackTrigger ControlID="lstRegie" EventName="SelectedIndexChanged" />
		<ajax:AsyncPostBackTrigger ControlID="lstAnnonceur" EventName="SelectedIndexChanged" />
	</Triggers>
	<ContentTemplate>
	<div id="layer1" style="position:absolute;width:700px;background-image:url('../../Images/blank.gif');background-repeat:repeat;">
		<ajax:UpdateProgress ID="uprog" AssociatedUpdatePanelID="upCampagne" DisplayAfter="0" DynamicLayout="true" runat="server">
		<ProgressTemplate>
			<img src="../../Images/loading.gif" alt="Veuillez patienter s'il vous plait" />
		</ProgressTemplate>
	</ajax:UpdateProgress>
	</div>
	<asp:GridView ID="gvCampagne" runat="server" 
		DataSourceID="sdsGvCampagne" 
		AutoGenerateColumns="false" 
		AllowPaging="true" 
		AllowSorting="true"
		DataKeyNames="Id_Campagne" 
		PageSize="15" 
		PagerStyle-HorizontalAlign="Center">
		<PagerSettings Position="Bottom" 
			Mode="NextPreviousFirstLast" 
			FirstPageText="Début" 
			LastPageText="Fin" 
			NextPageText="Suivant" 
			PreviousPageText="Précédent" />
		</asp:GridView>
		<asp:PlaceHolder ID="FormuModif" runat="server"></asp:PlaceHolder>
 
<script type="text/javascript" language="javascript">
    var yOffset = 300;
    function placeIt()
    {
        if (document.body.scrollTop < yOffset)
        {
            document.getElementById("layer1").style.top = yOffset;
        }
        else
        {
            document.getElementById("layer1").style.top = document.body.scrollTop + yOffset;
        }
        window.setTimeout("placeIt()", 10); 
    }
 
  placeIt();
</script>
	</ContentTemplate>
</ajax:UpdatePanel>

Et côté CodeBehind, ben je mets pas tout, mais si vous voyez une Sub qui manque, dites moi.

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
 
Protected Sub Page_Init(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Init
Dim idregie As String = "00000000-0000-0000-0000-000000000000"
Dim idannonceur As String = "00000000-0000-0000-0000-000000000000"
Dim type As String = ""
 
If lstRegie.SelectedValue <> "" Then
	idregie = lstRegie.SelectedValue
	type = "regie"
End If
If lstAnnonceur.SelectedValue <> "" Then
	idannonceur = lstAnnonceur.SelectedValue
	type = "annon"
End If
If lstRegie.SelectedValue <> "" And lstAnnonceur.SelectedValue <> "" Then
	type = "deux"
End If
sdsGvCampagne.SelectCommand = "EXEC dbo.SPEC_ListeCampagne '" & GetApplicationGUID().ToString & "', '" & idregie & "', '" & idannonceur & "', '" & type & "'"
 
End Sub
 
Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
 
ConstruireGV()
RemplirListeDeroulante(lstRegie, "Regie", enTypeContenuListe.UniqueIdentifier)
RemplirListeDeroulante(lstAnnonceur, "Annonceur", enTypeContenuListe.UniqueIdentifier)
FabriquerFormuModif()
FabriquerFormuTest()
FabriquerFormuApercu()
FabriquerFormuEnvoi()
AfficheTable("rien")
End Sub
 
Sub ConstruireGV()
gvCampagne.Columns.Clear()
gvCampagne.DataSourceID = "sdsGvCampagne"
Dim idcampagne, libelle, regie, boolactif As New BoundField
With idcampagne
	.HeaderText = "ID"
	.DataField = "Id_Campagne"
End With
With libelle
	.HeaderText = "Libellé"
	.DataField = "Libelle"
	.SortExpression = "Libelle"
End With
With regie
	.HeaderText = "Régie"
	.DataField = "Regie"
	.SortExpression = "Regie"
End With
Dim apercu, test, envoi, segment, modif, actif As New ButtonField
With apercu
	.HeaderText = "Apercu"
	.ButtonType = ButtonType.Image
	.ImageUrl = "~/App_Themes/" & GetNomsite() & "/loupe.png"
	.CommandName = "Apercu"
End With
With test
	.HeaderText = "Test"
	.ButtonType = ButtonType.Image
	.ImageUrl = "~/App_Themes/" & GetNomsite() & "/lettresinfo.png"
	.CommandName = "Test"
End With
With envoi
	.HeaderText = "Envoi"
	.ButtonType = ButtonType.Image
	.ImageUrl = "~/App_Themes/" & GetNomsite() & "/lettresinfo.png"
	.CommandName = "Envoi"
End With
With segment
	.HeaderText = "@"
	.ButtonType = ButtonType.Image
	.ImageUrl = "~/App_Themes/" & GetNomsite() & "/lettresinfo.png"
	.CommandName = "Segment"
End With
With modif
	.HeaderText = "Modif"
	.ButtonType = ButtonType.Image
	.ImageUrl = "~/App_Themes/" & GetNomsite() & "/modifier_16.png"
	.CommandName = "Modif"
End With
With actif
	.HeaderText = "Actif"
	.ButtonType = ButtonType.Image
	.CommandName = "Actif"
End With
Dim tacif As New TemplateField
With tacif
	.HeaderText = "tacif"
End With
 
gvCampagne.Columns.Add(idcampagne)
gvCampagne.Columns.Add(libelle)
gvCampagne.Columns.Add(regie)
gvCampagne.Columns.Add(apercu)
gvCampagne.Columns.Add(test)
gvCampagne.Columns.Add(envoi)
gvCampagne.Columns.Add(actif)
gvCampagne.Columns.Add(tacif)
gvCampagne.Columns.Add(modif)
End Sub
 
Protected Sub gvCampagne_RowCommand(ByVal sender As Object, ByVal e As System.Web.UI.WebControls.GridViewCommandEventArgs) Handles gvCampagne.RowCommand
 
Dim IdCell As TableCell
If IsNumeric(e.CommandArgument) Then
	IdCell = CType(gvCampagne.Rows(Convert.ToInt32(e.CommandArgument)), GridViewRow).Cells(0)
Else
	IdCell = gvCampagne.Rows(0).Cells(0)
	AfficheTable("rien")
End If
Select Case e.CommandName
	Case "first", "next", "last", "prev"
		AfficheTable("rien")
	Case "Apercu"
	RemplirFormuApercu(IdCell.Text)
		AfficheTable("tblFormuApercu")
 
	Case "Modif"
		RemplirFormuModif(IdCell.Text)
		AfficheTable("tblFormuModif")
 
	Case "Test"
		AfficheTable("rien")
		EnvoiMailCampagne(IdCell.Text, GetMailUser(GetUserGUID()), GetUserGUID(), 0)
		AfficheTable("tblFormuTest")
 
	Case "Envoi"
		AfficheTable("tblFormuEnvoi")
		RemplirFormuEnvoi(IdCell.Text)
	Case "Actif"
		dmGlobCS.ExecuterRequeteSimple("EXEC SPEC_Campagne_Actif " & IdCell.Text)
	End Select
End Sub

Donc vous avez en plus mes deux essais sur les deux options proposées.

02/06/2008, 13h51
predalpha

Effectivement mais le plus important ? rowdatabound où qu'il est?

Ton code me semble juste. Je ferais juste un test en sortant le gridview du AJAX et en rajoutant .DataKeyNames en dessous du datasourceID.

Pis là, dis nous si tu as quelque chose

OOOOPPPSSSS
le voilà, mais en fait il correspond encore à la verion finale car j'ai pas trouvé le moyen d'accéder à la donnée qu'il me faut.
Code:

1 2 3 4 Protected Sub gvCampagne_RowDataBound(ByVal sender As Object, ByVal e As System.Web.UI.WebControls.GridViewRowEventArgs) Handles gvCampagne.RowDataBound CType(gvCampagne.Columns(6), ButtonField).ImageUrl = "~/App_Themes/" & GetNomsite() & "/1.png" End Sub
Je vais faire le test que tu m'indiques. Je reprendre une page vierge et sortir du UpdatePanel et aussi du Contrôle Utilisateur, car tout le code que j'ai fourni est dans un ASCX

02/06/2008, 14h23
predalpha

oki donnes des news :)
02/06/2008, 14h59
nah666

Sur l'option TemplateField, je rencontre un autre souci, différent.
Je ne réussi pas à le mettre en oeuvre à partir du CodeBehind. Je en trouve pas le moyen d'ajouter un contrôle dedans et la MSDN est muette là dessus, les seuls exemples qu'il donne sont côté HTML:

dim t as new TemplateField
dim ImgBtn as new ImageButton
with ImgBtn
...
end with
t.ItemTemplate = ImgBtn

--------------------
Sinon, au regard de ton code, tu place ton updatePanel en updateMode="Always"
puis tu place des triggers, j'ai pas trop compris l'interet de la manip, as tu vraiment besoin du Always ?
02/06/2008, 16h49
zooffy

Je vais essayer ton morceau de code pour le ItemTemplate, mais en début d'aprés midi, avant que je me fasse ennuyer par ma BDD, ça avait pas l'air de lui plaire ce genre de chose.

Sinon, le mode ALways, ben je sais pas trop, je mets des triggers pour pouvoir exécuter le code que je veux sur chaque action de l'utilistauer, le mode Always c'est aprce que je sais pas trop à quoi cert le Conditoinnal, enfin, j'ai pas compris ces subtilités.

Si tu as une explication simple, je veux bien. Mais simple, moi pas trés affuter sur AJAX, moi utiliser ARIEL d'abitude.........
02/06/2008, 16h58
zooffy

bon, donc j'ai essayé le ItemTemplate et j'ai eu un gentil message de la part du serveur.
Le voici, je vous laisse juger de l'éloquence de ce petit gars trés sympa, qu'à pas l'air de comprendre que je pourrai lui appuyer sur le bouton et le terminer mieux qu'un T1000 ...........
GGRRREEEE

Citation:

Impossible d'effectuer un cast d'un objet de type 'System.Web.UI.WebControls.ImageButton' en type 'System.Web.UI.ITemplate'.
02/06/2008, 17h00
nah666

Je ne saurai trop te conseiller que de lire rapidement les propriétés du updatepanel, surtout :

-UpdateMode
-ChildrensAsTriggers

Si tu sais pas a quoi ca sert, ca sert a rien de mettre un updatepanel.

UpdateMode="always" est utilisé dans des cas extremement particuliers, donc t'as 95% de chance de pas etre dans ce cas ( en gros ton updatePanel se rafraichit a tous les rafraichissements d'une page, partiels ou pas ).

Si tes triggers sont Dans ton updatePanel, pas besoin de lui préciser, il sont pas défaut triggers.

Google t'expliquera tout ca bien mieux que moi...
03/06/2008, 09h23
zooffy

Ben en fait, GOOGLE, c'est pas mon ami.
Et puis GOOGLE, il explique pas bien les choses de l'AJAX car il n'est pas trés calé en la matière, d'une aprt, mais surtout le peu de chose qu'il eput me raconter là dessus il me le dit dans un langage que je ne comprends pas. Il parait que ça s'appelle l'Anglais et que y a des millions de gens qui le parle. Mais pas de bol, pas moi !
(LuteceFalco, pas la peine de rebeurrer la tartine....)

Donc, si je comprends ce que tu dais là, je devrais plutôt passer en UpdateMode = "Conditionnal" et supprimer mes deux Triggers sur le gvCampagne.
Mais alors, comment le UpdatePanel qui contient mon GridVeiw va se mettre à jour quand je vais cliquer sur les boutons de commande ?
Ou alors est ce qu'il ne faudrait pas que je mette deux UpdatePanel, un pour leGridView et un pour la table en dessous qui acceuille les trucs qui se passent avec les boutons du RowCommand ?

Mais de toute façon, ceci nous écarte de la question de base : comment faire un bouton image qui déclenche un traitement et qui peut prendre une image différente selon le contenu d'une donnée de la table.

Mais merci pour ton aide, je vais tout de même aller voir mon ami GOOGLE pour voir ce qu'il peut me raconter comme histoire de UpdatePanel.
03/06/2008, 09h35
nah666

pour ton image
tu mets un imagebutton dans un templateField.

Dans le row Databound tu fais ton test, et via un findcontrol sur l'id de ton image tu lui change son url au besoin
03/06/2008, 09h42
zooffy

Je me permets de remonter mon message d'hier soir qui répond précisément à ton idée qui parraissait pas mal à la base. Mais visiblement le serveur ne l'entends pas de cette oreille.

T'en pense quoi ? Moi, je nage, je brasse et je ratisse, mais large....

Citation:

Envoyé par zooffy

bon, donc j'ai essayé le ItemTemplate et j'ai eu un gentil message de la part du serveur.
Le voici, je vous laisse juger de l'éloquence de ce petit gars trés sympa, qu'à pas l'air de comprendre que je pourrai lui appuyer sur le bouton et le terminer mieux qu'un T1000 ...........
GGRRREEEE