LinkButton dans Gridview : ID de la ligne en paramètre SqlDataSource d'un autre Gridview

**Jutas** · 26/04/2011, 11h36

Bonjour à tous,

débutant en ASP.NET, je cherche à réaliser une application pour établir le suivi des visites d'un site internet.

Pour l'instant je travaille avec des données insérées par moi même dans la BDD.
Je cherche à faire fonctionner l'interface et le traitement des données avant de me pencher sur la récupération via les connexions des visiteurs.

J'ai plutôt bien compris le système de Gridview et de SqlDataSource, cependant je me retrouve confronté à un problème.

Je dispose d'un tableau qui affiche plusieurs informations (Adresse IP, Domaine, Pages vues, Localisation, Commentaire).
Pour la colonne "Pages vues", j'affiche le nombre de pages consultées, et dans un TemplateField sans titre, je place juste à côté un LinkButton "Détail".
Lorsque je clique sur "Détail", une fenêtre "Dialog" (Jquery) s'ouvre et fait apparaître un autre GridView contenant les informations détaillées des pages vues (nom des pages, temps passé par page, temps total visite).

Mon soucis réside dans le fait que je n'arrive pas à afficher le détail des pages relative à l'ID de la ligne du Gridview, où se trouve le LinkButton.
Le "Dialog" s'ouvre bien, j'ai bien le Gridview qui apparaît mais quelque soit le LinkButton sur lequel je clique, j'ai toujours les informations relative à "ID = 1" (j'ai 5 lignes dans la base).

Voici quelques bouts de code, pour vous aider à mieux comprendre :

Page ascx

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
 
<asp:GridView ID="GV_ListeSynthetique" runat="server"  
    AutoGenerateColumns="False" 
    DataSourceID="SQL_ListeSynthetique" OnRowDataBound="GV_ListeSynthetique_RowDataBound" 
    AllowPaging="True" PageSize="10" DataKeyNames="ID_visite" CssClass="tablesorter" GridLines="None"> 
    <Columns> 
        <%-- Nom des colonnes du GV : affichage synthétique --%>
        <asp:CheckBoxField DataField="Statut" HeaderText="Statut" 
            SortExpression="Statut" />
        <asp:BoundField DataField="Date" DataFormatString = "{0:d}" HeaderText="Date" 
            SortExpression="Date" /> 
        <asp:BoundField DataField="AdresseIP" HeaderText="Adresse IP" 
            SortExpression="AdresseIP" /> 
        <asp:BoundField DataField="Domaine" HeaderText="Domaine" 
            SortExpression="Domaine" /> 
        <asp:BoundField DataField="Nb_pages" HeaderText="Pages vues" 
            SortExpression="Nb_pages" ControlStyle-CssClass="nbPages"/>
        <asp:TemplateField HeaderText="" SortExpression="">
            <%-- Bouton pour voir le détail des pages vues --%>
            <ItemTemplate>
                <asp:LinkButton ID="LB_DetailPages" runat="server" CssClass="open_dialog detailPage" 
                dlg="#dialog_detailPage">Détail</asp:LinkButton>
            </ItemTemplate>
        </asp:TemplateField>
        <asp:BoundField DataField="Localisation" HeaderText="Localisation" 
            SortExpression="Localisation" />        
        <asp:TemplateField HeaderText="Commentaire" SortExpression="Commentaire">
            <%-- Bouton pour voir le commentaire de la visite --%>
            <ItemTemplate>
                <asp:LinkButton ID="LB_Comment" runat="server" CssClass="open_dialog" 
                dlg="#dialog_comment">Voir</asp:LinkButton>
            </ItemTemplate>
        </asp:TemplateField>
 
...
 
       <asp:TemplateField>
            <ItemTemplate>
                <div id="dialog_detailPage" class="dialog" title="Détail des pages consultées">
                    <!-- GV contenant le nom des pages consultées et le temps passé sur chaque page -->
                    <asp:GridView ID="GV_DetailPages" runat="server" DataSourceID="SQL_DetailPages"
                        CssClass="tablesorter" GridLines="None" AutoGenerateColumns="False" DataKeyNames="ID_page">
                        <Columns>
                            <asp:BoundField DataField="nom_page" HeaderText="Nom de la page consultée" 
                                SortExpression="nom_page" />
                            <asp:BoundField DataField="temps_page" HeaderText="Temps passé sur la page" 
                                SortExpression="temps_page" />
                        </Columns>
                        <RowStyle CssClass="RowStyle" />
                        <EmptyDataRowStyle CssClass="EmptyRowStyle" />
                        <PagerStyle CssClass="PagerStyle" />
                        <SelectedRowStyle CssClass="SelectedRowStyle" />
                        <HeaderStyle CssClass="HeaderStyle" />
                        <EditRowStyle CssClass="EditRowStyle" />
                        <AlternatingRowStyle CssClass="AltRowStyle" />
                    </asp:GridView>
                </div>
            </ItemTemplate>
        </asp:TemplateField>
 
<%-- 1)a] SqlDataSource du GV : affichage synthétique --%> 
<asp:SqlDataSource ID="SQL_ListeSynthetique" runat="server" 
    ConnectionString="<%$ ConnectionStrings:suivi_visitesConnectionString2 %>" 
    SelectCommand="SELECT ID_visite, Statut, `Date`, AdresseIP, Domaine, Nb_pages, Localisation FROM skill_visite" 
    ProviderName="<%$ ConnectionStrings:suivi_visitesConnectionString2.ProviderName %>"> 
</asp:SqlDataSource> 
 
<%-- 2)a] SqlDataSource du GV du dialog : Détail pages --%>    
<asp:SqlDataSource ID="SQL_DetailPages" runat="server" 
    ConnectionString="<%$ ConnectionStrings:suivi_visitesConnectionString2 %>" 
    ProviderName="<%$ ConnectionStrings:suivi_visitesConnectionString2.ProviderName %>"
    SelectCommand="select ID_page, ID_visite, nom_page, temps_page from skill_page_visite where ID_visite = @id_selectedVisite">
    <SelectParameters>
        <asp:Parameter name="id_selectedVisite" DbType="Int32" />
    </SelectParameters>
</asp:SqlDataSource>

Code behind

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
14
 
Partial Class controls_ControlListeVisites
    Inherits System.Web.UI.UserControl
    Private _currentRow As Integer
 
Protected Sub GV_ListeSynthetique_RowDataBound(ByVal sender As Object, ByVal e As System.Web.UI.WebControls.GridViewRowEventArgs)
        If e.Row.RowType = DataControlRowType.DataRow Then
            _currentRow = e.Row.DataItem("ID_visite")
        End If
    End Sub
 
    Protected Sub SQL_DetailPages_Selecting(ByVal sender As Object, ByVal e As System.Web.UI.WebControls.SqlDataSourceSelectingEventArgs) Handles SQL_DetailPages.Selecting
        e.Command.Parameters("id_selectedVisite").Value = _currentRow + 1
    End Sub

Javascript pour le Dialog (Jquery)

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
 
function MakeDialogBoxes() {
    $(".dialog").dialog({ autoOpen: false});
    $(".open_dialog").click(function () {
        var id = null;
        if ($(this).attr("dlg")) id = $(this).attr("dlg");
        if (!id && $(this).attr("href")) id = $(this).attr("href");
        if (id) {
            var dlg = $(id).dialog('open');
            dlg.parent().appendTo($("form:first"));
        }
        return false;
    });

Remarque : concernant le test sur le "href", je m'en sers pour une autre partie du code.

Concrètement, je cherche à faire passer l'ID de la ligne du GridView où se trouve le LinkButton sur lequel on clique, et le passer en paramètre du SqlDataSource pour le détail des pages.

En espérant que vous pourrez m'aider.

Cordialement,

Jutas

**Ramajb** · 26/04/2011, 21h59

Salut, remplace la partie

Code :

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

 <asp:Parameter name="id_selectedVisite" DbType="Int32" />

par ceci

Code :

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

1
2
 
<asp:ControlParameter controlId="GV_ListeSynthetique" name="id_selectedVisite" propertyName="SelectedValue"/>

La tu lui dis que a chaque postback ou on peut récupérer la valeur de la propriété 'SelectedValue' du gridview parent, liée la valeur de ce dernier au parametre id_selectedVisite.
Je pense pas que t'auras besoin de gérer l’événement OnRowDataBound et OnSelecting

A+

**Jutas** · 27/04/2011, 09h32

Bonjour,

Merci pour ta réponse. J'ai essayé mais malheureusement ça ne fonctionne toujours pas.

Dès que je retire le OnSelecting pour attribuer au paramètre une valeur, le GridView n'affiche plus rien.
Pour ce qui est de la propertyName, ça ne marche pas non plus, j'ai l'impression que le clic sur le LinkButton ne déclenche pas la sélection de la ligne.

J'ai tenté de mettre CommandName="Select" dans le LinkButton, essayé de passer un CommandArgument dans le code behind mais rien ne fonctionne.

Jutas

**Jutas** · 27/04/2011, 15h51

Je reviens pour reformuler mon problème.

Dans un Gridview, j'ai un Linkbutton présent sur chaque ligne.
Lorsque je clique sur ce LinkButton, une fenêtre "Dialog" (Jquery) s'ouvre et affiche un second Gridview, contenant les détails de la ligne d'où provient le clic sur le Linkbutton.

L'ouverture du Dialog se fait sans Selectionner la ligne du Gridview, ainsi j'évite un rechargement de la page.

Mon soucis, c'est que je dois récupérer l'ID de cette ligne, sans la sélectionner. Est-ce possible?

Existe t-il un moyen de récupérer le RowIndex du "Conteneur" du LinkButton, à savoir le GridView?

En espérant que quelqu'un puisse m'éclairer.

Jutas

**Jutas** · 27/04/2011, 15h53

Merci pour ta réponse Ramajb,

j'ai posté le message précédent pendant que tu me répondais, je vais tester ça et je te tiens au courant.

**Ramajb** · 27/04/2011, 16h06

Envoyé par Jutas

Je reviens pour reformuler mon problème.

Dans un Gridview, j'ai un Linkbutton présent sur chaque ligne.
Lorsque je clique sur ce LinkButton, une fenêtre "Dialog" (Jquery) s'ouvre et affiche un second Gridview, contenant les détails de la ligne d'où provient le clic sur le Linkbutton.

L'ouverture du Dialog se fait sans Selectionner la ligne du Gridview, ainsi j'évite un rechargement de la page.

Mon soucis, c'est que je dois récupérer l'ID de cette ligne, sans la sélectionner. Est-ce possible?
Jutas

Je pense qu'avec du javascript tu peux récupérer la ligne sectionné, par contre tu ne peux pas changer les données dans ton gridview detail car n'oublie que pas le binding se fait de cote serveur, de plus ta requête select contient une clause where donc il faut passé du côté serveur pour remonté les données correspondantes.
J’espère t'avoir éclaircir certaines points

**Jutas** · 27/04/2011, 16h14

En modifiant le LinkButton en CommandField ça marche bien, le seul petit problème, c'est que (et je ne l'avais pas précisé au départ...) je tiens à afficher ce Gridview sans recharger la page. Or la commande Select génère la validation.

Ce n'est pas perdu car si je n'arrive pas à récupérer l'ID comme je le souhaiterais, je me rabattrai sur cette solution, je te remercie en tout cas.

Concernant le Gridview "détaillé", c'est uniquement un Select d'autres champs qui n'apparaissent pas dans la ligne de base. Je ne compte pas éditer les valeurs.

Tu as parlé de javascript pour éventuellement récupérer la ligne du LinkButton, tu aurais une petite idée de comment s'y prendre?

Merci pour tes réponses.

**Ramajb** · 27/04/2011, 15h45

Envoyé par Ramajb

Salut, remplace la partie

Code :

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

 <asp:Parameter name="id_selectedVisite" DbType="Int32" />

par ceci

Code :

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

1
2
 
<asp:ControlParameter controlId="GV_ListeSynthetique" name="id_selectedVisite" propertyName="SelectedValue"/>

La tu lui dis que a chaque postback ou on peut récupérer la valeur de la propriété 'SelectedValue' du gridview parent, liée la valeur de ce dernier au parametre id_selectedVisite.
Je pense pas que t'auras besoin de gérer l’événement OnRowDataBound et OnSelecting
A+

j'ai l'impression que le clic sur le LinkButton ne déclenche pas la sélection de la ligne.

Dans ce cas je te propose de changer le LinkButton en CommandField, tu remplace tout ça

Code :

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

1
2
3
4
5
6
7
<asp:TemplateField HeaderText="" SortExpression="">
            <%-- Bouton pour voir le détail des pages vues --%>
            <ItemTemplate>
                <asp:LinkButton ID="LB_DetailPages" runat="server" CssClass="open_dialog detailPage" 
                dlg="#dialog_detailPage">Détail</asp:LinkButton>
            </ItemTemplate>
        </asp:TemplateField>

par

Code :

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

<asp:CommandField ShowSelectButton="True" SelectText="Détail"></asp:CommandField>

Et de déplacer

<%-- 2)a] SqlDataSource du GV du dialog : Détail pages --%>

juste devant

GV_DetailPages

i.e dans le Template.
A+

LinkButton dans Gridview : ID de la ligne en paramètre SqlDataSource d'un autre Gridview

ASP.NET

Vue hybride

Discussions similaires

Partager

Partager