如何在选择一行GridView时显示隐藏列数据?

时间:2012-03-02 12:45:45

标签: javascript jquery asp.net gridview popup

我有一个gridview,其中隐藏了第四列,其中有一个面板。

早些时候,当我使用AJAX HoverMenuExtender鼠标悬停在特定行上时,我显示了隐藏面板

<asp:TemplateField>
                                <ItemTemplate>
                                    <asp:HoverMenuExtender ID="HoverMenuExtender" runat="server" PopupControlID="PopupMenu"
                                        TargetControlID="grdMainData" PopupPosition="Center" OffsetY="30" OffsetX="10"
                                        PopDelay="50" HoverCssClass="popupHover">
                                    </asp:HoverMenuExtender>
                                    <asp:Panel runat="server" ID="PopupMenu" CssClass="popupMenu">
    <asp:Label ID="lblVDetails" runat="server" Text='<%#Eval("vDetails")%>'/>
                              </asp:Panel>
                             </ItemTemplate>
                            </asp:TemplateField>

它的工作非常好......

但现在我想在gridview中放一个按钮,当我点击按钮

时显示弹出窗口

表示当我点击row1按钮时,我应该弹出row1的Panel,我不希望任何页面刷新

是否可以使用任何JavaScript或jQuery或AJAX Extenders

有可能吗?

这是我的网格视图:

<asp:GridView ID="grdMainData" runat="server" CellPadding="3" BackColor="White" BorderColor="#CCCCCC"
                        BorderStyle="None" BorderWidth="1px" Width="900" OnRowCreated="GridView1_RowCreated"
                        AutoGenerateColumns="False" OnRowDataBound="grdMainData_RowDataBound">
                        <Columns>
                            <asp:BoundField HeaderText="Curriculum" DataField="Curriculum" />
                            <asp:BoundField HeaderText="Title" DataField="Title" />
                            <%--<asp:BoundField HeaderText="Code" DataField="Code" />--%>
                            <asp:TemplateField>
                            <ItemTemplate>
                            <asp:Button type="button" ID="btnCode" class="button-code" runat="server" Text='<%#Eval("Code") %>'/>
                            </ItemTemplate>
                            </asp:TemplateField>
                            <asp:BoundField HeaderText="Stage" DataField="Stage" />
                            <asp:TemplateField>
                                <ItemTemplate>
                                    <asp:ModalPopupExtender ID="ModalPopupExtender" runat="server" TargetControlID="btnCode" PopupControlID="PopupMenu" DropShadow="true" CancelControlID="lnkClose">
                                    </asp:ModalPopupExtender>

                                    <asp:Panel runat="server" ID="PopupMenu" CssClass="popupMenu">
    <asp:Label ID="lblVDetails" runat="server" Text='<%#Eval("vDetails").ToString().Replace("\u2022","<br/> \u2022")%>'/>
    <asp:LinkButton ID="lnkClose" runat="server">Close</asp:LinkButton>
                              </asp:Panel>
                             </ItemTemplate>
                            </asp:TemplateField>
                        </Columns>
</asp:GridView>

1 个答案:

答案 0 :(得分:0)

因为您已经在使用AJAX Extender。我建议继续使用它。

AJAX控件工具包的ModalPopUpExtender非常适合您的需求。你可以查看它的演示和文件here

<强>更新
使用此标记

<asp:ModalPopupExtender 
     ID="ModalPopupExtender" 
     runat="server"
     TargetControlID="btnCode"
     PopupControlID="PopupMenu">
</asp:ModalPopupExtender>