How to hookup the LinkButton in a GridView with a ModalPopupExtender in ASP.Net C#?

I really need some help here. I am trying to hookup a linkbutton in my GridView to a ModalPopupExtender, but with no luck. Basically I have a GridView which list all the users' info from a database, and I made the username as linkbutton. When you click the username, a modalpopup should show up, and you should be able to edit the user and update the database. I also I have an Add button. when you click the button, the same modalpopup should show up and you can add a new user to the database. Following are my aspx and code behind. So far I have two major problems. (1) the OnClick even doesn't get fired all the time. (2) the modalpopup doesn't show up when clicking the username linkbutton. Really appreciated if someone could help me out here.

Here is my aspx page:

<%@ 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="serve开发者_StackOverflow社区r" 
    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>

Here is the code behine in C#, somehow the click event didn't get fired all the time.

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";

        }
    }
}

Too much code to write, but you need to associate each LinkButton to a ModalPopupExtender during GridView.RowDataBound.

Your real problem though is getting access to the row data to edit. If that is the real goal, see the example below and then you can integrate it with the ModalPopupExtender.

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

I recommend you go with a ListView, the templates(EditItemTemplate...etc) are much easier to work with.