ASP.NET 2.0 GridView 含 DropDownList 編輯刪除完整實例

GridView 內嵌 DropDownList 進行編輯是常見需求，本文提供可直接落地的完整代碼，涵蓋分頁、排序、滑鼠特效、資料繫結全流程。

ASPX 宣告重點

<asp:GridView ID="GridView1" ... 
    DataKeyNames="DB31_1,DB31_2" 
    OnRowEditing="GridView1_RowEditing"
    OnRowUpdating="GridView1_RowUpdating"
    OnRowDeleting="GridView1_RowDeleting"
    OnRowCancelingEdit="GridView1_RowCancelingEdit"
    OnRowDataBound="GridView1_RowDataBound"
    OnPageIndexChanging="GridView1_PageIndexChanging">

    <asp:TemplateField HeaderText="學歷代碼">
        <EditItemTemplate>
            <asp:DropDownList ID="ddlXL" runat="server" />
        </EditItemTemplate>
        <ItemTemplate>
            <asp:Label ID="Label1" Text='<%# Bind("xueliText") %>' />
        </ItemTemplate>
    </asp:TemplateField>
    ...
</asp:GridView>

後端核心邏輯

資料繫結

private void GridViewBind()
{
    string sql = "SELECT * FROM DB1";
    GridView1.DataSource = conn.GetDs(sql).Tables[0].DefaultView;
    GridView1.DataBind();
}

編輯/取消/分頁

protected void GridView1_RowEditing(object s, GridViewEditEventArgs e)
{
    GridView1.EditIndex = e.NewEditIndex;
    GridView1.EditRowStyle.BackColor = Color.FromName("#F7CE90");
    GridViewBind();
}
protected void GridView1_RowCancelingEdit(object s, GridViewCancelEditEventArgs e)
{
    GridView1.EditIndex = -1; GridViewBind();
}
protected void GridView1_PageIndexChanging(object s, GridViewPageEventArgs e)
{
    GridView1.PageIndex = e.NewPageIndex; GridViewBind();
}

刪除

protected void GridView1_RowDeleting(object s, GridViewDeleteEventArgs e)
{
    string key = GridView1.DataKeys[e.RowIndex].Values[0].ToString();
    conn.RunSql($"DELETE FROM DB1 WHERE DB1_1='{key}'");
    GridViewBind();
}

更新（含 DropDownList 取值）

protected void GridView1_RowUpdating(object s, GridViewUpdateEventArgs e)
{
    string id = GridView1.DataKeys[e.RowIndex].Values[0].ToString();
    string val = ((DropDownList)GridView1.Rows[e.RowIndex].FindControl("ddlXL")).SelectedItem.Text;
    // ... 更新資料庫 ...
    GridView1.EditIndex = -1; GridViewBind();
}

RowDataBound：動態繫結 DropDownList + 滑鼠特效

protected void GridView1_RowDataBound(object s, GridViewRowEventArgs e)
{
    // 1. 編輯模式下為 DropDownList 填項目
    if (e.Row.RowState == DataControlRowState.Edit)
    {
        var ddl = (DropDownList)e.Row.FindControl("ddlXL");
        ddl.Items.AddRange(new[] {
            new ListItem("博士", "1"),
            new ListItem("碩士", "2"),
            new ListItem("學士", "3")
        });
    }

    // 2. 滑鼠進入/離開/點擊特效
    if (e.Row.RowType == DataControlRowType.DataRow)
    {
        e.Row.Attributes["onmouseover"] = "this.style.backgroundColor='yellow';";
        e.Row.Attributes["onmouseout"] = "this.style.backgroundColor='';";
        e.Row.Attributes["onclick"] = "this.style.backgroundColor='#99cc00';";
    }
}

關鍵技巧總結

• DataKeyNames 設定主鍵，刪除/更新時透過 DataKeys[e.RowIndex] 取值。
• FindControl 定位編輯模板內的控件。
• RowDataBound 統一處理動態繫結與客戶端特效。
• 實際專案建議採用參數化查詢防止 SQL Injection。