首現我們拖入一個DataGridView控制項到.aspx頁面中,然後綁定你需要顯示的列,具體代碼如下。
複製代碼 代碼如下:
<asp:GridView ID="gvDepartList" runat="server" AutoGenerateColumns="False"
Height="108px" Width="600px" OnRowDeleting="gvDepartList_RowDeleting" RowDataBound="gvDepartList_RowDataRound">
<Columns>
<asp:TemplateField HeaderText="部門名稱" >
<ItemTemplate>
<asp:Label runat="server" style="text-align:center" Text='<%# Eval("DepartName") %>' />
</ItemTemplate>
</asp:TemplateField>
<asp:BoundField HeaderText="機構" DataField="BranchId" />
<asp:BoundField HeaderText="負責人" DataField="PrincipalUser" />
<asp:BoundField HeaderText="聯絡電話" DataField="ConnectTelNo" />
<asp:BoundField HeaderText="行動電話" DataField="ConnectMobileTelNo"/>
<asp:BoundField HeaderText="傳真" DataField="Faxes" />
<asp:TemplateField HeaderText="修改">
<ItemTemplate>
<asp:ImageButton ID="ImageButton1" ImageUrl="../images/edit.gif" CommandArgument='<%#Eval("DepartId") %>' CommandName="delete" runat="server" />
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="刪除">
<ItemTemplate>
<asp:ImageButton ImageUrl="../images/delete.gif" CommandArgument='<%#Eval("DepartId") %>' CommandName="delete" runat="server" />
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
二:在這個.aspx頁面背景Page_load事件中綁定資料。
複製代碼 代碼如下:
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
gvDepartList.DataSource= new DepartInfoManager().GetDepartInfos(-1);
gvDepartList.DataBind();
}
}
如果我們想添加一個DataGridView的光棒效果,就是每一行滑鼠懸浮上去變動背景色啦。
複製代碼 代碼如下:
/// <summary>
/// 動態註冊指令碼(在GridView控制項呈現之前) 光棒效果
/// </summary>
/// <param name="sender"></param>
/// <param name="e"></param>
protected void gvUsers_RowDataBound(object sender, GridViewRowEventArgs e)
{
//此處判斷只有在資料行在進行指令碼註冊
if (e.Row.RowType == DataControlRowType.DataRow)
{
//光棒效果
e.Row.Attributes.Add("onmouseover","currentcolor=this.style.backgroundColor;this.style.backgroundColor='#6699ff'");
e.Row.Attributes.Add("onmouseout ", "this.style.backgroundColor=currentcolor");
LinkButton lnkbtnDel = e.Row.FindControl("lnkbtnDel") as LinkButton;
lnkbtnDel.Attributes.Add("onclick", "return confirm('確定刪除嗎?')");
}
}
現在重點來了,怎麼一行的資料呢?既然是刪除,我們肯定是要根據一條資料的ID來刪除了,那麼我們在Page_load方法中加入一段代碼:
gvDepartList.DataKeyNames = new string[] { "id"};//這個代碼是什麼意思呢,就是每一行設定一個鍵,這個鍵就是用來操作資料的。
現在我們用另外一種方法刪除,看到頁面中的倒數第二列,沒錯,是一個ImageButtom控制項,這個控制項是放了一個刪除按鈕的小表徵圖,CommandArgument是幹什麼的呢?CommandName又是幹什麼的呢?CommandArgument就是指定我們要操作的參數,CommandName就是指令這個按鈕是要幹什嗎?這裡用到的是刪除,我們寫上Delete。
複製代碼 代碼如下:
<asp:TemplateField HeaderText="刪除">
<ItemTemplate>
<asp:ImageButton ImageUrl="../images/delete.gif" CommandArgument='<%#Eval("DepartId") %>' CommandName="delete" runat="server" />
</ItemTemplate>
</asp:TemplateField>
接下來就是後台作業碼了,可以看到這個DataGridView綁定了一個OnRowDeleting事件,這個事件就是用來刪除的。
然後我們在這個事件寫上這樣的代碼。
複製代碼 代碼如下:
/// <summary>
/// 刪除選中的行
/// </summary>
/// <param name="sender"></param>
/// <param name="e"></param>
protected void gvDepartList_RowDeleting(object sender, GridViewDeleteEventArgs e)
{
ImageButton buttom = gvDepartList.Rows[e.RowIndex].FindControl("btnDelete") as ImageButton;
string departId = buttom.CommandArgument.ToString();
if (manage.DeleteDepart(departId))
{
Page.ClientScript.RegisterClientScriptBlock(this.GetType(), "alert", "<script>alert('刪除成功!');</script>");
BindDepartInfos();//重新綁定資料
}
else
{
Page.ClientScript.RegisterClientScriptBlock(this.GetType(), "alert", "<script>alert('刪除失敗!');</script>");
}
}
為了更好的使用者體驗,我們可以不使用這個Page.ClientScript.RegisterClientScriptBlock(this.GetType(), "alert", "<script>alert('刪除成功!');</script>");
可以選擇在頁面中顯眼的地方放一個label控制項,設計Visible=false;隱藏它,然後刪除成功後,利用這個Label控制項來提示使用者,刪除成功!