Discussion :

[kalan]

Bonjour, Je souhaiterais creer une TemplateColumn qui fasse la même chose qu'un EditCommandColumn sauf que dans le footer il y aurait un linkButton "add".
Mais je sais pas comment faire pour mettre toutes les colonnes en mode Edit par ex ...
voici ma classe TemplateColumn avec les trous que je sais pas faire ... Si vous pouviez m'aider ca sera super gentil et tout

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

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
 
sing System;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Data;
 
namespace Controls
{
	public class DataGrid2Template : ITemplate
	{
		ListItemType templateType;
		string columnName;
 
		public DataGrid2Template(ListItemType type, string colname)
		{
			templateType = type;
			columnName = colname;
		}
 
		private void BindEdit(object sender,System.EventArgs e)
		{
			//????????????????
		}
 
		private void BindUpdate(object sender,System.EventArgs e)
		{
			//????????????????
		}
 
		private void BindCancel(object sender,System.EventArgs e)
		{
		               //????????????????
		}
 
		private void BindAdd(object sender,System.EventArgs e)
		{
		              //????????????????	
		}
 
		public void InstantiateIn(System.Web.UI.Control container)
		{
			Literal lc = new Literal();
			switch(templateType)
			{
				case ListItemType.Header:
					//No header for this kind of column
					break;
				case ListItemType.Item:
					//We want a linkButton name Update
					LinkButton lb = new LinkButton();
					lb.Text="Edit";
					lb.DataBinding += new EventHandler(BindEdit);
					container.Controls.Add(lb);
					break;
				case ListItemType.EditItem:
					//We want 2 link Button Update and Cancel
					LinkButton lb2 = new LinkButton();
					LinkButton lb3 = new LinkButton();
					lb2.Text = "Update";
					lb3.Text = "Cancel";
 
					lb2.DataBinding += new EventHandler(BindUpdate);
					lb3.DataBinding += new EventHandler(BindCancel);
					container.Controls.Add(lb2);
					container.Controls.Add(lb3);
					break;
				case ListItemType.Footer:
					//We want a linkButton named Add
					LinkButton lb4 = new LinkButton();
					lb4.Text="Add";
					lb4.DataBinding += new EventHandler(BindAdd);
					container.Controls.Add(lb4);
					break;
			}
		}
	}
}

[neguib]

J'ai effectivement fait quelquechose d'approchant sauf que je gère différemment
d'une part la classe template
ici

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

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
public class DataGrid2Template : ITemplate 
   { 
      ListItemType templateType; 
      string columnName; 
 
      public DataGrid2Template(ListItemType type, string colname) 
      { 
         templateType = type; 
         columnName = colname; 
      } 
 
      public void InstantiateIn(System.Web.UI.Control container) 
      { 
         Literal lc = new Literal(); 
         switch(templateType) 
         { 
            case ListItemType.Header: 
               //No header for this kind of column 
               break; 
            case ListItemType.Item: 
               //We want a linkButton name Update 
               LinkButton lb = new LinkButton(); 
               lb.Text="Edit"; 
               lb.DataBinding += new EventHandler(BindEdit); 
               container.Controls.Add(lb); 
               break; 
            case ListItemType.EditItem: 
               //We want 2 link Button Update and Cancel 
               LinkButton lb2 = new LinkButton(); 
               LinkButton lb3 = new LinkButton(); 
               lb2.Text = "Update"; 
               lb3.Text = "Cancel"; 
 
               lb2.DataBinding += new EventHandler(BindUpdate); 
               lb3.DataBinding += new EventHandler(BindCancel); 
               container.Controls.Add(lb2); 
               container.Controls.Add(lb3); 
               break; 
            case ListItemType.Footer: 
               //We want a linkButton named Add 
               LinkButton lb4 = new LinkButton(); 
               lb4.Text="Add"; 
               lb4.DataBinding += new EventHandler(BindAdd); 
               container.Controls.Add(lb4); 
               break; 
         } 
      } 
   }

et d'autre part La page contenant le Datagrid par exemple:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
DataGrid1.EditCommand += new DataGridCommandEventArgs(EditItem);
DataGrid1.UpdateCommand +=new DataGridCommandEventArgs(UpdateItem);
DataGrid1.CancelCommand +=new DataGridCommandEventArgs(CancelItem);
DataGrid1.SortCommand +=new DataGridCommandEventArgs(TriItem);
DataGrid1.ItemCommand +=new DataGridCommandEventArgs(DataGrid1_Command); ...
//initialiser EditCommandColumn
//initialiser TemplateColumn
//initialiser BoundColumn
//initialiser styles
...
//faire le code de chaque procedure associées aux evenements de la datagrid

[kalan]

Merci neguib
Comment tu traites manuellement le passage en "edit Mode" de la ligne selectionnée ? De même les evenements bindEdit etc ... tu les as mis ou du coup ?


Kal'

[neguib]

Ben en fait c'est automatique l'edition des texbox à moins de faire un code qui l'empêche pour la reste je comprends pas trop ce que tu veux; donc comme je suis unpeu fatigué on va dire que c'est moi qui comprends pas Commences à coder si un souci se pose précis dis le moi j'essaierai plutôt de t'aider pas à pas.
C'est vrai que j'ai résumé le code pour eviter d'en ecrire des tonnes
Je reprends les principes

• 1. une classe DataGridTemplate
  2. une page avec Datagrid
  [list:d9c6ce10df] a. Une fonction InitDatgrid() qui renvoie un datagrid
  [list:d9c6ce10df] initialisation du style
  initialisation des colonnes non databindable
  initialisation des evenement....

b. Une fonction InitDataSource qui renvoie une dataview

• initialise Dtatable à aprtir d'une source de données
  initialise boundcolonnes (notamment sort)
  initialise la dataview

c. Une procedure de BindDataGrid
d. des procédures evenements[/list:u:d9c6ce10df][/list:u:d9c6ce10df]
D'ailleurs en t'ecrivant je me rends compte que les points a & b & c & d pourraient très bien faire l'objet d'une classe MaDataGrid appelée et paramétrée dans la Page

[kalan]

En fait ce que je comprends pas : Tu link un évènement sur le linkButton Edit : La fonction qui est liée (par ex bienEdit) va devoir changer la column pour pouvoir afficher Update et Cancel non ?
Et mettre en textbox le reste de la ligne ?

Je vois pas comment ca pourrait se faire automatiquement à part si on définit une EditComandColumn ...

Effectivement, je fais une datagrid spécial qui fait a, b, c, d, et qui contient different TemplateColumn du coup,

TemplateColumn1 pour Edit -> Update/Cancel et au pied Add
et
TemplateColumn 2 avec en pied un textbox.


J'espère que je m'exprime bien lol

Merci encore pour ton aide en tout cas

[kalan]

En fait la je suis sur l'autre template par exemple et je vois toujours pas comment lié des evenements dessus ...

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

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
 
using System;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Data;
using System.Drawing;
 
namespace elphControls
{
	public class DataGridTemplate : ITemplate
	{
		ListItemType templateType;
		string columnName;
 
		public DataGridTemplate(ListItemType type, string colname)
		{
			templateType = type;
			columnName = colname;
		}
 
		private void bind(object sender,System.EventArgs e)
		{
			Literal l = (Literal) sender;
			DataGridItem container = (DataGridItem) l.NamingContainer;
			l.Text = ((DataRowView) container.DataItem)[columnName].ToString();
		}
 
		private void bindEdit(object sender,System.EventArgs e)
		{
			TextBox tb = (TextBox) sender;
			DataGridItem container = (DataGridItem) tb.NamingContainer;
			tb.Text = ((DataRowView) container.DataItem)[columnName].ToString();
		}
 
		private void bindSort(object sender,System.EventArgs e)
		{
			LinkButton lb = (LinkButton) sender;
			DataGridItem container = (DataGridItem) lb.NamingContainer;
			//((DataRowView) container.DataItem).DataView. ??
		}
 
		public void InstantiateIn(System.Web.UI.Control container)
		{
 
			switch(templateType)
			{
				case ListItemType.Header:
						LinkButton lb = new LinkButton();
						lb.ForeColor = Color.White;
						lb.Text = "<B>" + columnName + "</B>";
						lb.DataBinding += new EventHandler(bindSort);
						container.Controls.Add(lb);
					break;
				case ListItemType.Item:
						Literal lc = new Literal();
						lc.Text = "";
						lc.DataBinding += new EventHandler(bind);
						container.Controls.Add(lc);
					break;
				case ListItemType.EditItem:
						TextBox tb = new TextBox();
						tb.Text = "";
						tb.DataBinding += new EventHandler(bindEdit);
						container.Controls.Add(tb);
					break;
				case ListItemType.Footer:
						TextBox tb2 = new TextBox();
						tb2.ID=columnName;
						tb2.Text = "";
						container.Controls.Add(tb2);
					break;
			}
		}
	}
}

Par ex j'aimerais faire l'evenement sortCommand sur le linkButton du header.


Dans ma DataGridSpecial qui herite de DataGrid j'initialise mes templateColumn comme ceci :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
 
 
 
			TemplateColumn tc1 = new TemplateColumn();
 
			tc1.HeaderTemplate = new 
				DataGridTemplate(ListItemType.Header, "Subject");
			//It's important to put the real column Name of the DB
			//To make the implicit binding with the database
			tc1.ItemTemplate = new 
				DataGridTemplate(ListItemType.Item, "HT_Subject_Name");
			tc1.EditItemTemplate = new 
				DataGridTemplate(ListItemType.EditItem, "HT_Subject_Name");
 
 
			tc1.FooterTemplate = new 
				DataGridTemplate(ListItemType.Footer, "Subject");
			this.Columns.Add(tc1);

et dans ma DataGridSpecial j'ia une commande pour effectuer le rangement:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
 
public void OrderGrid(object sender, DataGridSortCommandEventArgs e) 
		{
			this.ViewState["_orderBy"]=(string)e.SortExpression;
			if(this.ViewState["_orderType"].ToString()=="ASC")
				this.ViewState["_orderType"]="DESC";
			else if(this.ViewState["_orderType"].ToString()=="DESC")
				this.ViewState["_orderType"]="ASC";
			this.DataSource = CreateDataSet();
			this.DataBind();   
		}

que j'ai liée dans le Init: this.sortCommand= new ...(OrderGrid)

Et j'arrive pas a faire le lien entre ces 2 actions finalement ...

[neguib]

En fait ce que je comprends pas : Tu link un évènement sur le linkButton Edit : La fonction qui est liée (par ex bienEdit) va devoir changer la column pour pouvoir afficher Update et Cancel non ?
Et mettre en textbox le reste de la ligne ?
Je vois pas comment ca pourrait se faire automatiquement à part si on définit une EditComandColumn ...

Ben oui c'est ce que j'ai mis dans le code de la page non

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

//initialiser EditCommandColumn

[kalan]

Justement il n'y a pas de EditCommandColumn mais une TemplateColumn qui fait la meme chose sauf quand plus elle effectue aussi un traitement dans le footer ...

J'ai l'impression que je suis débile la lol ...

Je pige plus du tout ...
Vais relire ce que tu as écris avant

[neguib]

Bon je pars du fait que la classe Datgrid Template c ok on en parles(pour l'instant du moins )
Maintenant passons à la datagrid dans maPage
exemple en vb concernant pour l'instant que le design

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

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
 
Protected EditCommande As EditCommandColumn
Protected templateColonne As TemplateColumn
Protected boundColonne As BoundColumn
Protected WithEvents Monbouton As Button
Protected templateType As ListItemType
Protected colonneNom As String
Protected WithEvents DataGrid1 As System.Web.UI.WebControls.DataGrid
 
Private Sub initDataGrid()
  DataGrid1.AutoGenerateColumns = "False"
  AddHandler DataGrid1.EditCommand, AddressOf EditItem
  AddHandler DataGrid1.UpdateCommand, AddressOf UpdateItem
  AddHandler DataGrid1.CancelCommand, AddressOf CancelItem
  AddHandler DataGrid1.SortCommand, AddressOf TriItem
  AddHandler DataGrid1.DeleteCommand, AddressOf DeleteItem
  AddHandler DataGrid1.ItemCommand, AddressOf DataGrid1_Command
  DataGrid1.ItemStyle.Font.Size = FontUnit.Parse("XX-Small")
  DataGrid1.ItemStyle.Font.Name = "Arial"
  DataGrid1.ItemStyle.ForeColor = Color.FromArgb(74, 60, 140)
  DataGrid1.ItemStyle.BackColor = Color.FromArgb(231, 231, 255)
  DataGrid1.AlternatingItemStyle.BackColor = Color.FromArgb(247, 247, 247)
  DataGrid1.HeaderStyle.Font.Bold = True
  DataGrid1.HeaderStyle.HorizontalAlign = HorizontalAlign.Center
  DataGrid1.HeaderStyle.Font.Size = FontUnit.Parse("XX-Small")
  DataGrid1.HeaderStyle.Font.Name = "Arial"
  DataGrid1.HeaderStyle.ForeColor = Color.FromArgb(247, 247, 247)
  DataGrid1.HeaderStyle.BackColor = Color.FromArgb(74, 60, 140)
  DataGrid1.AllowSorting = "True"
  DataGrid1.HorizontalAlign = HorizontalAlign.Center
  DataGrid1.BackColor = Color.WhiteSmoke
  DataGrid1.BorderStyle = BorderStyle.None
  DataGrid1.BorderColor = Color.FromArgb(231, 231, 255)
  DataGrid1.BorderWidth = Unit.Pixel(1)
  DataGrid1.CellPadding = 3
  DataGrid1.GridLines = GridLines.Horizontal
  EditCommande = New EditCommandColumn
  EditCommande.ButtonType = ButtonColumnType.LinkButton
  EditCommande.EditText = "EDIT"
  EditCommande.UpdateText = "UPDATE"
  EditCommande.CancelText = "CANCEL"
  EditCommande.ItemStyle.Font.Name = "Arial"
  EditCommande.ItemStyle.Font.Size = FontUnit.Parse("XX-Small")
  EditCommande.ItemStyle.Font.Bold = True
  EditCommande.ItemStyle.ForeColor = Color.FromArgb(247, 247, 247)
  EditCommande.ItemStyle.BackColor = Color.FromArgb(74, 60, 140)
  DataGrid1.Columns.Add(EditCommande)
  templateColonne = New TemplateColumn
  templateColonne.ItemTemplate = New DataGridTemplate(ListItemType.Item, "DELETE")
  DataGrid1.Columns.Add(templateColonne)
End Sub

Est ce que ceci commence à t'éclairer où il t'en faut plus
Oh si un petit plus

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
Private Sub EditItem(ByVal sender As Object, ByVal e As DataGridCommandEventArgs)
     Select Case e.CommandName
        Case "Edit"
            DataGrid1.EditItemIndex = e.Item.ItemIndex
            DataGrid1.DataSource = vue
            DataGrid1.DataBind()
        Case "ADD"
            Dim textebox As New TextBox
            templateColonne.FooterTemplate = New DataGridTemplate(ListItemType.Footer, "ADD")
            DataGrid1.Columns.Add(templateColonne)
     End Select
End Sub

[kalan]

J'ai bien lu ton code et du coup j'ai deux questions ... (dis moi si je suis lourd hein )

Si j'ai bien compris tu as une colonne Edit et une colonne Template qui joue le role du delete.

D'ailleurs comment tu peux savoir qu'un add est fait dans EditItem car tu ne le mentionnes jamais avant et tu ne l'a pas mis dans le footer du editCommandColumn du coup ?

Merci pour tes réponses en tout cas !!

[neguib]

J'ai bien lu ton code et du coup j'ai deux questions ... (dis moi si je suis lourd hein )
Si j'ai bien compris tu as une colonne Edit et une colonne Template qui joue le role du delete.
D'ailleurs comment tu peux savoir qu'un add est fait dans EditItem car tu ne le mentionnes jamais avant et tu ne l'a pas mis dans le footer du editCommandColumn du coup ?
Merci pour tes réponses en tout cas !!

Meuh non t'es pas lourd tes questions sont tout a fait legitime
La réponse est retout à ce que j'ai mis de côté en préambule
MaClasse DatagridTemplate
volà comment je l'ai construit, bonne lecture c tjrs du vb

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

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
 
Public Class DataGridTemplate
         Implements ITemplate
         Protected templateType As ListItemType
         Protected colonneNom As String
         Protected WithEvents Monbouton As Button
         Protected WithEvents MonInput As TextBox
         Protected WithEvents MonLabel As Label
 
         Sub New(ByVal type As ListItemType, ByVal ColName As String)
		templateType = type
		colonneNom = ColName
         End Sub
 
         Sub InstantiateIn(ByVal container As Control) Implements ITemplate.InstantiateIn
	Select Case colonneNom
		Case "ADD"
			MonInput = New TextBox
			container.Controls.Add(MonInput)
			MonInput.Dispose()
		Case "DELETE", "PRINT", "EDIT", "INSERT"
			Monbouton = New Button
			Monbouton = creerBouton(Monbouton, colonneNom)
			container.Controls.Add(Monbouton)
			Monbouton.Dispose()
		Case Else
			MonLabel = New Label
			MonLabel.Text = colonneNom
			container.Controls.Add(MonLabel)
			MonLabel.Dispose()
	End Select
        End Sub
 
        Public Function creerBouton(ByVal bouton As Button, ByVal texte As String) As Button
		bouton.BackColor = Color.FromArgb(74, 60, 140)
		bouton.ForeColor = Color.FromArgb(247, 247, 247)
		bouton.Width = Unit.Pixel(50)
		bouton.Font.Name = "Arial"
		bouton.Font.Size = FontUnit.Parse("XX-Small")
		bouton.ID = texte
		bouton.Text = texte
		bouton.CommandName = texte
		Select Case texte
			Case "DELETE"
				bouton.AccessKey = "D"
				bouton.ToolTip = "ALT-d"
			Case "PRINT"
				bouton.AccessKey = "P"
				bouton.ToolTip = "ALT-p"
			Case "EDIT"
				bouton.AccessKey = "E"
				bouton.ToolTip = "ALT-e"
			Case "INSERT"
				bouton.AccessKey = "I"
				bouton.ToolTip = "ALT-i"
		End Select
		Return bouton
           End Function
 
End Class

Voilà cette classe je l'utlises pour plusieurs Datagrid dans mon appli qui n'ont pas toute les m^mes fonctionnalité
à toi maintenant d'exploiter cette classe pour les datagrids que tu souhaites
je ne peux évidemment pas te fournir tout les codes de mes datagrids je crois maintenant que tu suffisamment d'element pour chercher un peu par toi même
Bien sûr nous nous sommes intéressé ici qu'à l'aspect design codé

[kalan]

Ok Merci je vais m'imprimer tout ca et le lire durant le week end pour que ca "macère" un peu lol

sinon je sais pas si tu es encore la mais je voulais te demander si lorsque que l'on fait un TemplateColumn et qu'une cellule de cette template peut etre ou bien un literal en mode "normal" ou un textbox en mode Edit, et lors d'un update on veut pouvoir comparer la valeur qu'il y avait avant dans le literal avec celui ecrit dans la textbox ... est ce que c'est possible ?
j'ai essayé ca :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
 
((TextBox)e.Item.Cells[i].Controls[1]).Text; 
((Literal)e.Item.Cells[i].Controls[0]).Text;

Mais il ne veut pas du coup ...
J'imagine qu'il y a un moyen car meme si tu changes un textbox et que tu appuis sur cancel ca remet la val du literal ... donc je suis entrain de regarder ca ... lol ... La datagrid est pleine d'obstacle ... LOL

Merci pour tout 8)

[kalan]

J'ai trouvé la solution tout seul du coup je poste ici la solution si ca peut peut etre aider quelqu'un ma foi :

En fait dans ma templateColumn une cellule lors d'un edit mode et composé d'un literal et d'une textbox toutes les databinder pour pouvoir recuperer les valeurs de la base de données.

La textbox reste visible alors que le literal est caché, du coup ca me sert de "cache" de donnée !

et me permet d'avoir les deux valeurs !! ouiiiizzzz lol

J'espère que ca pourra aider quelqu'un cette petite astuce (qui me semble a déja été dite peut être lol)

[neguib]

kalan tu vois çà rentre

[kalan]

Ca y est ca marche
En fait c'est vrai c'est tout con ...
tout simplement mettre le CommandName d'un controle et de recuperer ce commandname dans ItemCommand de la datagrid, et d'effectuer le traitement ...

Merci pour ton aide en tout cas !