如何将 GridView 中的 LinkBut​​ton 与 ASP.Net C# 中的 ModalPopupExtender 连接起来？

Question

我真的需要一些帮助。我正在尝试将 GridView 中的链接按钮连接到 ModalPopupExtender，但没有运气。基本上我有一个 GridView，它列出了数据库中所有用户的信息，我将用户名设置为链接按钮。当您单击用户名时，应该会出现一个 modalpopup，您应该能够编辑用户并更新数据库。我也有一个添加按钮。当您单击按钮时，应显示相同的 modalpopup，您可以将新用户添加到数据库。 以下是我的 aspx 和代码。到目前为止，我有两个主要问题。 (1) OnClick 甚至不会一直被触发。 (2) 单击用户名链接按钮时，modalpopup 不显示。 如果有人可以在这里帮助我，我真的很感激。

这是我的 aspx 页面：

<%@ Page Title="" Language="C#" MasterPageFile="~/Default.Master" AutoEventWireup="true" CodeBehind="EditUsers.aspx.cs" Inherits="SPR2_v1.EditUsers" %>
<%@ Register assembly="AjaxControlToolkit" namespace="AjaxControlToolkit" tagprefix="asp" %>

<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" runat="server">


<div id="pagetitle">
    <h1>SPR Users</h1>
</div>
<div >
    <asp:Label ID="lblErrorMsg" runat="server" ForeColor="Red"></asp:Label>
    <table align="center" >
        <tr>
            <td align="right">
                <asp:Button ID="btnAddUser" runat="server" Text="Add User" Width="85px" 
                    onclick="btnAddUser_Click" />
            </td>
        </tr>
        <tr>
            <td align="left">
                <asp:GridView ID="gvUsers" runat="server" AllowPaging="True" 
                    AllowSorting="True" AutoGenerateColumns="False" 
                    DataSourceID="SqlDSUsers" EnableViewState="False">
                    <Columns>
                        <asp:TemplateField HeaderText="UserName">
                        <ItemTemplate>
                            <asp:LinkButton ID="lnkUserName" runat="server" 
                            Text='<%# Eval("UserName")%>' OnClick="lnkUserName_Click">
                            </asp:LinkButton>                            
                        </ItemTemplate>
                        </asp:TemplateField>                    
                        <asp:BoundField DataField="UserName" HeaderText="UserName" 
                            SortExpression="UserName" Visible="false" />
                        <asp:BoundField DataField="Extension" HeaderText="Extension" 
                            SortExpression="Extension" />
                        <asp:BoundField DataField="Email" HeaderText="E-mail" 
                            SortExpression="Email" />
                        <asp:BoundField DataField="Company" HeaderText="Company" 
                            SortExpression="Company" />
                        <asp:BoundField DataField="Department" HeaderText="Department" 
                            SortExpression="Department" />
                        <asp:BoundField DataField="Access Level" HeaderText="Access Level" 
                            SortExpression="Access Level" />
                    </Columns>
                </asp:GridView>
                <asp:SqlDataSource ID="SqlDSUsers" runat="server" 
                    ConnectionString="<%$ ConnectionStrings:SPRConnectionString %>" 
                    SelectCommand="..."></asp:SqlDataSource>
            </td>
        </tr>
    </table>

<asp:ModalPopupExtender id="mpeAddUser" runat="server" 
    TargetControlID="btnAddUser" 
    PopupControlID="panelEditUser" 
    CancelControlID="btnCancel" 
    PopupDragHandleControlID="PopupHeader" 
    Drag="true" 
    DropShadow="true"  
    BackgroundCssClass="ModalPopupBG" >
</asp:ModalPopupExtender>

<asp:Button ID="btnEditUser" runat="server" style="display:none" />

<asp:ModalPopupExtender id="mpeEditUser" runat="server" 
    TargetControlID="btnEditUser" 
    PopupControlID="panelEditUser" 
    CancelControlID="btnCancel" 
    PopupDragHandleControlID="PopupHeader" 
    Drag="true" 
    DropShadow="true"  
    BackgroundCssClass="ModalPopupBG" >
</asp:ModalPopupExtender>

<asp:panel id="panelEditUser" style="display: none" runat="server">
<div id="ModalPopup">
<div id="PopupHeader">Add a New User</div>

     <table>
         <tr>
             <td>First Name</td>
             <td>
                 <asp:TextBox ID="txtFirstName" runat="server"></asp:TextBox>

             </td>
         </tr>
         <tr>
             <td>Last Name</td>
             <td>
                 <asp:TextBox ID="txtLastName" runat="server"></asp:TextBox>

             </td>
         </tr>
         <tr>
             <td>Extension</td>
             <td>
                 <asp:TextBox ID="txtExtension" runat="server"></asp:TextBox>

             </td>
         </tr>
         <tr>
             <td>E-mail</td>
             <td>
                 <asp:TextBox ID="txtEmail" runat="server"></asp:TextBox>

             </td>
         </tr>
         <tr>
             <td>Company</td>
             <td>
                 <asp:DropDownList ID="ddlCompany" runat="server" DataSourceID="SqlDSCompany" 
                     DataTextField="ProductVendorName" DataValueField="ProductVendorID" 
                     AppendDataBoundItems="True">
                 <asp:ListItem Value="" Text=""></asp:ListItem>
                 </asp:DropDownList>
                 <asp:SqlDataSource ...>
                 </asp:SqlDataSource>
             </td>
         </tr>
         <tr>
             <td>Department</td>
             <td>
                 <asp:DropDownList ID="ddlDepartment" runat="server" 
                     DataSourceID="SqlDSDepartment" DataTextField="DepartmentName" 
                     DataValueField="DepartmentID" AppendDataBoundItems="True">
                 <asp:ListItem Value="" Text=""></asp:ListItem>
                 </asp:DropDownList>

                 <asp:SqlDataSource ...>
                 </asp:SqlDataSource>
             </td>
         </tr>
         <tr>
             <td>Access Level</td>
             <td>
                 <asp:DropDownList ID="ddlAccessLevel" runat="server" 
                     DataSourceID="SqlDSAccessLevel" DataTextField="LevelID" 
                     DataValueField="LevelID" AppendDataBoundItems="True">
                 <asp:ListItem Value="" Text=""></asp:ListItem>
                 </asp:DropDownList>

                 <asp:SqlDataSource ...>
                 </asp:SqlDataSource>
             </td>
         </tr>
         <tr>
             <td>
                 &nbsp;</td>
             <td>
                 <asp:Button ID="btnEdit" runat="server" Text="Submit" 
                     onclick="btnEdit_Click" />
                 <asp:Button ID="btnReset" runat="server" Text="Reset" 
                     onclientclick="return resetUser();" />
                 <input id="btnCancel" type="button" value="Cancel" />
             </td>
         </tr>
     </table>
</div></asp:panel>

</div>
</asp:Content>

这是 C# 中的代码，不知何故，click 事件并没有一直被触发。

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Data;
using System.Data.SqlClient;
using System.Text;

namespace SPR2_v1
{
    public partial class EditUsers : System.Web.UI.Page
    {
        ...
        protected void lnkUserName_Click(object sender, System.EventArgs e)
        {
            LinkButton lbUserName = sender as LinkButton;
            GridViewRow gvr = (GridViewRow)lbUserName.NamingContainer;

            txtFirstName.Text = "";
            txtLastName.Text = "";
            txtExtension.Text = gvr.Cells[2].Text;
            txtEmail.Text = gvr.Cells[3].Text;
            ddlCompany.SelectedItem.Text = gvr.Cells[4].Text;
            ddlDepartment.SelectedItem.Text = gvr.Cells[5].Text;
            ddlAccessLevel.SelectedItem.Text = gvr.Cells[6].Text;

            btnEdit.Text = "Update User";
            mpeEditUser.Show();
        }

        protected void btnAddUser_Click(object sender, EventArgs e)
        {
            btnEdit.Text = "Add User";

        }
    }
}

Answer 1

要编写的代码太多，但您需要在GridView.RowDataBound 期间将每个LinkButton 关联到一个ModalPopupExtender。

您真正的问题是访问要编辑的行数据。如果这是真正的目标，请参阅下面的示例，然后您可以将其与 ModalPopupExtender 集成。

GridView Examples for ASP.NET 2.0: Editing the Underlying Data in a GridView

我建议您使用ListView，模板（EditItemTemplate...等）更容易使用。