<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="DataList.aspx.cs" Inherits="FileUpload自動上傳文件.DataList" %> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> <title></title> <style type="text/css"> .style1{ width:784px; } .style2 { width:126px; } </style> </head> <body> <form id="form1" runat="server"> <div> <asp:DataList ID ="dataList1" runat ="server" RepeatColumns ="1" GridLines ="Both" RepeatLayout ="Table" RepeatDirection ="Horizontal" onitemcommand="dataList1_ItemCommand" oneditcommand="dataList1_EditCommand" oncancelcommand="dataList1_CancelCommand" ondeletecommand="dataList1_DeleteCommand" onselectedindexchanged="dataList1_SelectedIndexChanged" onupdatecommand="dataList1_UpdateCommand" DataKeyField ="Id" > <HeaderTemplate ><%--頁眉模版，和Repeater稍微不同，一般每個模版如果用到了table都應該在當前模版閉合，即當前模版用<table></table>包裹，而不是把<table>放在HeaderTemplate</table>放在FooterTemplate閉合，--%> <table><%--因為如果按照后者做會使得RepeatColumns不生效，RepeatColumns意思的每行顯示的項個數，即顯示多少個ItemTemplate，一般只會顯示一項因為這樣每列的標題和每列的內容容易對齊，如果不對齊需要用樣式設置每列的寬度使其對齊--%> <tr class="style1"> <th class="style2">標題1</th> <th class="style2">標題2</th> <th class="style2">標題3</th> <th class="style2">標題4</th> <th class="style2">時間</th> </tr> </table> </HeaderTemplate> <ItemTemplate> <table > <tr class="style1"> <td class="style2"><%#DataBinder.Eval(Container.DataItem,"title1")%></td> <td class="style2"><%#DataBinder.Eval(Container.DataItem, "title2")%></td> <td class="style2"><%#DataBinder.Eval(Container.DataItem, "title3")%></td> <td class="style2"><%#DataBinder.Eval(Container.DataItem, "title4")%></td> <td class="style2"><%#DateTime.Now.ToString()%></td> <td class="style2" id ="td"> <ul> <li><asp:LinkButton id ="LinkButton2" runat ="server" CommandName ="edit" Text ="edit" ></asp:LinkButton></li> <li><asp:LinkButton id ="LinkButton1" runat ="server" CommandName ="select" Text ="select" ></asp:LinkButton></li> <li><asp:LinkButton id ="LinkButton3" runat ="server" CommandName ="delete" Text ="刪除" ></asp:LinkButton></li> </ul> </td> </tr> </table> </ItemTemplate> <SelectedItemTemplate ><%--SelectedItemTemplate一般選中后需要呈現不同的控件才需要使用這個模版，如果只是樣式不同只需要設置SelectedItemStyle--%> <table > <tr class="style1"> <td class="style2" style="color:Red;"><asp:TextBox ID ="txtTitle1" runat ="server" Text ='<%#DataBinder.Eval(Container.DataItem, "title1")%>'></asp:TextBox></td> <td class="style2"><asp:TextBox ID ="txtTitle2" runat ="server" Text ='<%#DataBinder.Eval(Container.DataItem, "title2")%>'></asp:TextBox></td> <td class="style2"><asp:TextBox ID ="txtTitle3" runat ="server" Text ='<%#DataBinder.Eval(Container.DataItem, "title3")%>'></asp:TextBox></td> <td class="style2"><asp:TextBox ID ="txtTitle4" runat ="server" Text ='<%#DataBinder.Eval(Container.DataItem, "title4")%>'></asp:TextBox></td> <td class="style2"><%#DateTime.Now.ToString()%></td> <td class="style2" id ="td"> <ul> <li><asp:LinkButton id ="Linkcancel" runat ="server" CommandName ="cancelselect" Text ="取消選中" ></asp:LinkButton></li> </ul> </td> </tr> </table> </SelectedItemTemplate> <EditItemTemplate ><%--EditItemTemplate一般用於編輯時程序文本框給用戶輸入--%> <table > <tr class="style1"> <td class="style2" style="color:Red;"><asp:TextBox ID ="txtTitle1" runat ="server" Text ='<%#DataBinder.Eval(Container.DataItem, "title1")%>'></asp:TextBox></td> <td class="style2"><asp:TextBox ID ="txtTitle2" runat ="server" Text ='<%#DataBinder.Eval(Container.DataItem, "title2")%>'></asp:TextBox></td> <td class="style2"><asp:TextBox ID ="txtTitle3" runat ="server" Text ='<%#DataBinder.Eval(Container.DataItem, "title3")%>'></asp:TextBox></td> <td class="style2"><asp:TextBox ID ="txtTitle4" runat ="server" Text ='<%#DataBinder.Eval(Container.DataItem, "title4")%>'></asp:TextBox></td> <td class="style2"><%#DateTime.Now.ToString()%></td> <td class="style2" id ="td"> <ul> <li><asp:LinkButton id ="Linkupdate" runat ="server" CommandName ="update" Text ="更新" ></asp:LinkButton></li> <li><asp:LinkButton id ="Linkcancel" runat ="server" CommandName ="cancel" Text ="取消" ></asp:LinkButton></li> </ul> </td> </tr> </table> </EditItemTemplate> <FooterStyle BackColor="#990000" Font-Bold="true" ForeColor="White" /> <AlternatingItemStyle BackColor="White" /> <ItemStyle BackColor="#FFFBD6" ForeColor="#333333" /> <SeparatorStyle BorderStyle="Dashed" /> <SelectedItemStyle BackColor="#FFCC66" Font-Bold="true" ForeColor="Navy" /> <FooterTemplate ></FooterTemplate> </asp:DataList> </div> </form> </body> </html>
using System; using System.Collections.Generic; using System.Linq; using System.Web; using System.Web.UI; using System.Web.UI.WebControls; using System.Data; namespace FileUpload自動上傳文件 { public partial class DataList : System.Web.UI.Page { protected void Page_Load(object sender, EventArgs e) { if (!IsPostBack) { BindRptData(); } } private void BindRptData() { DataTable dt = new DataTable(); dt.Columns.Add("Id"); dt.Columns.Add("title1"); dt.Columns.Add("title2"); dt.Columns.Add("title3"); dt.Columns.Add("title4"); for (int i = 1; i < 5; i++) { DataRow row = dt.NewRow(); row["id"] = i; row["title1"] = "title1" + i; row["title2"] = "title2" + i; row["title3"] = "title3" + i; row["title4"] = "title4" + i; dt.Rows.Add(row); } dataList1.DataSource = dt; dataList1.DataBind(); } protected void dataList1_ItemCommand(object source, DataListCommandEventArgs e) { //所有的操作都可以放在這個方法進行，比如編輯，取消，更新，刪除都可以放到此處進行，也可以用單獨的方法，如dataList1_EditCommand switch (e.CommandName.ToLower()) { case "select": //選中控件時如果使用了SelectedItemTemplate需要重新綁定數據，綁定數據可以在此處進行，也可以在dataList1_SelectedIndexChanged進行，若在此處進行需要設置dataList1.SelectedIndex = e.Item.ItemIndex;，因為此時dataList1.SelectedIndex為-1 //dataList1.SelectedIndex = e.Item.ItemIndex; //BindRptData(); break; //取消操作要根據取消的操作類型做不同動作，如取消選中應該把SelectedIndex設置為-1，取消編輯，應該把EditItemIndex設置為-1，並且設置后都要重新綁定數據 case "cancelselect": dataList1.SelectedIndex = -1; BindRptData(); break; } } protected void dataList1_EditCommand(object source, DataListCommandEventArgs e) { //datalist編輯需要設置編輯索引，然后重新綁定數據，只要用到EditItemTemplate， SelectedItemTemplate這兩個模版點擊對應的操作時都要重新綁定數據 dataList1.EditItemIndex = e.Item.ItemIndex; BindRptData(); } protected void dataList1_CancelCommand(object source, DataListCommandEventArgs e) { //這里只對應CommandName 為cancel的動作，每個方法都對應着特定的CommandName，如dataList1_EditCommand對應的CommandName為edit， //如果有多種取消動作則需要取不同的CommandName放到dataList1_ItemCommand方法去做 dataList1.EditItemIndex = -1; BindRptData(); } protected void dataList1_SelectedIndexChanged(object sender, EventArgs e) { BindRptData(); } protected void dataList1_UpdateCommand(object source, DataListCommandEventArgs e) { TextBox txtTitle1 = e.Item.FindControl("txtTitle1") as TextBox; TextBox txtTitle2 = e.Item.FindControl("txtTitle2") as TextBox; TextBox txtTitle3 = e.Item.FindControl("txtTitle3") as TextBox; TextBox txtTitle4 = e.Item.FindControl("txtTitle4") as TextBox; /*** 更新到數據庫代碼 * * * * ***/ //更新后取消編輯狀態，重新綁定數據顯示到界面 dataList1.EditItemIndex = -1; BindRptData(); } protected void dataList1_DeleteCommand(object source, DataListCommandEventArgs e) { //DataKeys 存放的是每行記錄的主鍵，需要設置DataKeyField字段 string id = dataList1.DataKeys[e.Item.ItemIndex].ToString(); //刪除當前記錄，重新綁定數據 //SqlCommand cmd = new SqlCommand("Delete From Union_User Where ID=" + id, conn); //cmd.ExecuteNonQuery(); BindRptData(); } } }
相關參考資料：
http://halesir.blog.163.com/blog/static/204612069201223174854257/
http://halesir.blog.163.com/blog/static/20461206920122317514384/
http://halesir.blog.163.com/blog/static/20461206920123865357191/
http://blog.csdn.net/ranlianjie/article/details/1618073