Discussion :

[Roken62]

Boujour,

J'ai un truc qui me tracasse assez fortement.

J'ai une GridView (Parent) à l'intérieur d'une autre GridView (Enfant). La GridView Enfant peut avec un bouton de la GridView Parent s'ouvrir ou se fermer.

Lors du clic sur ce bouton l'événement RowCommand est appelé afin de binder les data dans la GridView enfant...

Pas de soucis de ce côté là.

Par contre le truc très embêtant c'est que pour ouvrir/fermer la div GridView enfant j'utilise un script Javascript, et lors d'un postback soit après l'événement RowCommand ma div se referme automatiquement. Cela doit être du fait de la ré initialisation du contrôle...

Bref j'aimerais donc une petite aide d'une ame charitable afin de garder l'état de la div (fermé/ouvert) après un postBack.

Voici le code :

'Le Javascript permettant de Collapse / Expand une div

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
 
    <script language="JavaScript" type="text/javascript">
        var currentlyOpenedDiv = "";
        function CollapseExpand(object) {
            var div = document.getElementById(object);
            if (currentlyOpenedDiv != "" && currentlyOpenedDiv != div) {
                currentlyOpenedDiv.style.display = "none";
            }
            if (div.style.display == "none") {
                div.style.display = "inline";
                currentlyOpenedDiv = div;
            }
            else {
                div.style.display = "none";
            }
        }
    </script>

'Mes Gridview parent/child

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
 
        <div id="blocGrid" runat="server">
            <asp:ScriptManager ID="ScriptManager1" runat="server">
            </asp:ScriptManager>
            <asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional" RenderMode="Inline">
                <ContentTemplate>
                    <asp:GridView ID="GridPanier" 
                    runat="server" 
                    AutoGenerateColumns="False" 
                    GridLines="None"
                    CssClass="mGrid" 
                    PagerStyle-CssClass="pgr" 
                    AlternatingRowStyle-CssClass="alt"
                    AllowSorting="true"
                    OnRowDataBound="GridPanier_RowDataBound" 
                    OnRowCommand="GridPanier_RowCommand">
                        <Columns>
                            <asp:BoundField HeaderText="Pos" DataField="num_position" ReadOnly="True" DataFormatString="{0:F0}" />
                            <asp:BoundField HeaderText="Article" DataField="refart" ReadOnly="True" />
                            <asp:BoundField HeaderText="Désignation" DataField="designation" ReadOnly="True" />
                            <asp:BoundField HeaderText="Qté" DataField="qte" ReadOnly="True" DataFormatString="{0:F0}" />
                            <asp:BoundField HeaderText="Dispo" DataField="Dispo" ReadOnly="True" DataFormatString="{0:F0}"
                                NullDisplayText="NULL" />
                                <asp:TemplateField>
                                <ItemTemplate>
                                    <asp:ImageButton ID="Info" CommandName="linkInfo"  CommandArgument='<%# DirectCast(Container, GridViewRow).RowIndex %>' ImageUrl="App_Themes/Images/find.png"  runat="server" />
                                </ItemTemplate>
                                </asp:TemplateField>
                                <asp:TemplateField>
                                <ItemTemplate>
                                    <asp:ImageButton ID="PicNomenclature"  CommandName="linkPicNomenclature"  CommandArgument='<%# DirectCast(Container, GridViewRow).RowIndex %>' ImageUrl="App_Themes/Images/nomenclature.jpg" runat="server" />
                                </ItemTemplate>
                                </asp:TemplateField>
                            <asp:ImageField DataImageUrlField="PictureURL" AlternateText="Qté stock insuffisant">
                            </asp:ImageField>
                            <asp:TemplateField>
                                <ItemTemplate>
                                    </td></tr>
                                    <tr>
                                        <td colspan="8">
                                            <div id="<%# Eval("refart") %>" style="display: none; position: relative">
                                                <asp:GridView ID="GridNomenclature" 
                                                runat="server" 
                                                AutoGenerateColumns="false" 
                                                GridLines="None"
                                                CssClass="mGrid" 
                                                AlternatingRowStyle-CssClass="alt" 
                                                EmptyDataText="Il n'y a pas de nomeclature associé à l'article"
                                                Width="100%">
                                                    <Columns>
                                                        <asp:BoundField HeaderText="Article" DataField="N2" ReadOnly="True" />
                                                        <asp:BoundField HeaderText="Désignation" DataField="L2" ReadOnly="True" />
                                                        <asp:BoundField HeaderText="Qté" DataField="COEFF_N2" ReadOnly="True" DataFormatString="{0:F0}" />
                                                    </Columns>
                                                </asp:GridView>
                                            </div>
                                        </td>
                                    </tr>
                                </ItemTemplate>
                            </asp:TemplateField>
                        </Columns>
                    </asp:GridView>
                </ContentTemplate>
            </asp:UpdatePanel>
            <asp:UpdateProgress ID="upg1" runat="server" AssociatedUpdatePanelID="UpdatePanel1">
                <ProgressTemplate>
                    action en cours
                </ProgressTemplate>
            </asp:UpdateProgress>
        </div>

'Evenement RowDataBound

Code :

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

1
2
3
4
5
6
7
8
9
10
 
Protected Sub GridPanier_RowDataBound(ByVal sender As Object, ByVal e As System.Web.UI.WebControls.GridViewRowEventArgs) Handles GridPanier.RowDataBound
 
        If e.Row.RowType = DataControlRowType.DataRow The
            Dim ctrl As Object = e.Row.Cells(6).Controls(1)
            Dim b As ImageButton = CType(ctrl, ImageButton)
            b.Attributes.Add("OnClick", "javascript:CollapseExpand('" + e.Row.Cells(1).Text + "')")
        End If
 
    End Sub

'Evenement rowCommand

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
 
    Protected Sub GridPanier_RowCommand(ByVal sender As Object, ByVal e As System.Web.UI.WebControls.GridViewCommandEventArgs) Handles GridPanier.RowCommand
        Dim retcode As Int16
        Dim dtNomenclature As DataTable
 
        If e.CommandName = "linkPicNomenclature" Then
            Dim index As Integer = Convert.ToInt32(e.CommandArgument)
            Dim row As GridViewRow = GridPanier.Rows(index)
 
            Dim GridNomenclature As GridView = CType(row.FindControl("GridNomenclature"), GridView)
            dtNomenclature = GetDataSql("", row.Cells(1).Text, 10070)
 
            GridNomenclature.DataSource = dtNomenclature
            GridNomenclature.DataBind()
            GridNomenclature.GridLines = GridLines.None
        End If
    End Sub

[Nicolas Esprit]

Bonjour,

Une astuce simple serait d'utiliser un HiddenField pour mémoriser la dernière GridView enfant "ouverte". Ensuite, en javascript tu utilises le Onload et si le HiddenField contient bien l'id d'une GridView enfant, alors tu appelles ta fonction CollapseExpand.

En espérant t'avoir aidé.

[Roken62]

Je ne connaissais pas le contrôle Hiddenfield.

Par contre je me suis documenté mais je ne vois absolument pas comment récupérer ma variable de mon div child.

Je pensais faire :

dans le onload

Code :

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

1
2
 
<body onload="javascript:RecupDiv();">

Ma fonction Recup div : mais je met quoi dans le getElementById vu que l'id de mon div change.

Code :

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

1
2
3
4
5
6
7
8
9
10
 
function RecupDiv()  
{  
    var childDivID = document.getElementById(" ").value;  
    if(childDivID != "none")  
    {  
        document.getElementById(childDivID).style.display = "inline";  
 
    } 
}

La même pour le hiddenfield Id ??

Code :

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

1
2
 
    <asp:HiddenField id=" "  value="none" runat="server"/>

Le code pour expand/collapse

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
 
function ExpandCollapse(Id)
{   
    var ExpandDiv = Id;
    var hiddenDivName;
 
    hiddenDivName = document.getElementById(" ");
 
    var divToExpand = document.getElementById(ExpandDiv);
    var divToCollapse = document.getElementById(hiddenDivName.value);
 
    if(hiddenDivName.value == "none")
    {
        divToExpand.style.display = "inline";
        hiddenDivName.value = ExpandDiv;
    }
    else if(hiddenDivName.value == ExpandDiv)
    {
        if(divToExpand.style.display == "inline")
        {    
            divToExpand.style.display = "none";
        }
        else
        {
            divToExpand.style.display = "inline";
         }
    }
    else
    {
        divToCollapse.style.display = "none";
        var str = hiddenDivName.value;
        hiddenDivName.value = ExpandDiv;
        divToExpand.style.display = "inline";
    }
 
}

J'ai "piqué" le code en faisant des recherches et adapté à ma sauce mais je bute sur l'id du hiddenfield...

[cinemania]

génère toi même l'id du div, de façon à ce qu'il dépende du DataItem dans lequel il se trouve, tout simplement.

si tu as généré toi même l'id du div, a priori en fonction du contenu du hiddenfield tu sera à même d'identifier le div équivalent en reconstruisant l'id...

[Nicolas Esprit]

L'ID de l'HiddenField sert, comme tout ID, à identifier de manière unique ton contrôle. Donc tu peux mettre ce que tu veux, du moment que l'ID utilisé est unique.

[Roken62]

génère toi même l'id du div, de façon à ce qu'il dépende du DataItem dans lequel il se trouve, tout simplement.

si tu as généré toi même l'id du div, a priori en fonction du contenu du hiddenfield tu sera à même d'identifier le div équivalent en reconstruisant l'id...

C'est ici que je le génère

Code :

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

1
2
 
<div id="<%# Eval("refart") %>" style="display: none; position: relative">

Diffèrent pour chaque child du contrôle parent.

L'ID de l'HiddenField sert, comme tout ID, à identifier de manière unique ton contrôle. Donc tu peux mettre ce que tu veux, du moment que l'ID utilisé est unique.

Ouais en fait je sais pas pourquoi je voulais mettre autre chose. Le manque de café peut être. J'ai posé une question complètement idiote lol.

Bref je reviens vers vous si j'ai une question plus pertinente

Merci