【转贴】ListView使用技巧
作者:方明
原贴地址:http://www.cnblogs.com/nuaalfm/archive/2008/09/03/1282468.html
目录:
ListView控件学习系列1-了解ListView控件
ListView控件学习系列2-编辑ListView
ListView控件学习系列3-ListView选择,排序,分页
ListView使用技巧
源码下载
1、鼠标移到ListView某一行时改变该行的背景色方法 前端代码:
前端代码 <asp:ListView ID="ListView1" runat="server" onitemdatabound="ListView1_ItemDataBound"> <LayoutTemplate> <table id="Table1" runat="server" border="0" style=""> <tr runat="server" id="itemPlaceholder" /> </table> </LayoutTemplate> <ItemTemplate> <tr runat="server" id="Tr"> <td> <%#Eval("ID") %> </td> <td> <%# Eval("name") %> </td> <td> <%# Eval("age") %> </td> </tr> </ItemTemplate> </asp:ListView>后台代码:
后台代码 protected void ListView1_ItemDataBound(object sender, ListViewItemEventArgs e) { if (e.Item.ItemType==ListViewItemType.DataItem) { (e.Item.FindControl("Tr") as HtmlTableRow).Attributes. Add("onmouseover", "c=this.style.backgroundColor;this.style.backgroundColor='#00A9FF'"); (e.Item.FindControl("Tr") as HtmlTableRow).Attributes. Add("onmouseout", "this.style.backgroundColor=c"); } }2、ListView和和下拉菜单DropDownList结合(其他控件其实也差不多): 前端代码:
前端代码 <asp:ListView ID="ListView1" runat="server" OnItemDataBound="ListView1_ItemDataBound"> <LayoutTemplate> <table id="Table1" runat="server" border="0" style=""> <tr runat="server" id="itemPlaceholder" /> </table> </LayoutTemplate> <ItemTemplate> <tr runat="server" id="Tr"> <td> <asp:Label ID="ID" runat="server" Text='<%#Eval("ID") %>'></asp:Label> </td> <td> <%# Eval("name") %> </td> <td> <%# Eval("age") %> </td> <td> <asp:DropDownList ID="SexDropDownList" runat="server"> </asp:DropDownList> </td> </tr> </ItemTemplate> </asp:ListView>模拟数据提供代码:
后台代码:
后台代码 protected void ListView1_ItemDataBound(object sender, ListViewItemEventArgs e) { DropDownList SexDropDownList = e.Item.FindControl("SexDropDownList") as DropDownList; int sex = da.Find(Convert.ToInt32((e.Item.FindControl("ID") as Label).Text)).Sex; ListItem listItem; if (sex == 0) { listItem = new ListItem("男", sex.ToString()); } else { listItem = new ListItem("女", sex.ToString()); } SexDropDownList.Items.Add(listItem); SexDropDownList.Enabled = false; }3、ListView实现删除时弹出确认对话框: 前端代码
前端代码 <asp:ListView ID="ListView1" runat="server" OnItemDataBound="ListView1_ItemDataBound"> <LayoutTemplate> <table id="Table1" runat="server" border="0" style=""> <tr runat="server" id="itemPlaceholder" /> </table> </LayoutTemplate> <ItemTemplate> <tr runat="server" id="Tr"> <td> <asp:Label ID="ID" runat="server" Text='<%#Eval("ID") %>'></asp:Label> </td> <td> <%# Eval("name") %> </td> <td> <%# Eval("age") %> </td> <td> <asp:Button ID="Delete" runat="server" Text="Delete" /> </td> </tr> </ItemTemplate> </asp:ListView>后台代码
后台代码 protected void ListView1_ItemDataBound(object sender, ListViewItemEventArgs e) { if (e.Item.ItemType == ListViewItemType.DataItem) { (e.Item.FindControl("Delete") as Button).Attributes.Add ("onclick", "javascript:return confirm('你确认要删除:\"" + (e.Item.FindControl("id") as Label).Text + "\"吗?')"); } }4、ListView实现自动编号
前端代码<asp:ListView ID="ListView1" runat="server" OnItemDataBound="ListView1_ItemDataBound"> <LayoutTemplate> <table id="Table1" runat="server" border="0" style=""> <tr runat="server" id="itemPlaceholder" /> </table> </LayoutTemplate> <ItemTemplate> <tr runat="server" id="Tr"> <td> <asp:Label ID="Num" runat="server"></asp:Label> </td> <td> <asp:Label ID="ID" runat="server" Text='<%#Eval("ID") %>'></asp:Label> </td> <td> <%# Eval("name") %> </td> <td> <%# Eval("age") %> </td> <td> <asp:Button ID="Delete" runat="server" Text="Delete" /> </td> </tr> </ItemTemplate> </asp:ListView>后台代码
后台代码int Num = 1; protected void ListView1_ItemDataBound(object sender, ListViewItemEventArgs e) { if (e.Item.ItemType == ListViewItemType.DataItem) { (e.Item.FindControl("Num") as Label).Text = Num.ToString(); Num++; } }5、将ListView中的内容以Excel导出
前端代码:
前端代码<div> <asp:ListView ID="ListView1" runat="server"> <ItemTemplate> <tr> <td id="Td1" runat="server" style=""> <asp:Label ID="idLabel" runat="server" Text='<%# Eval("name") %>' /> <br /> </td> <td> <asp:Label ID="xLabel" runat="server" Text='<%# Eval("Age") %>' /> <br /> </td> </tr> </ItemTemplate> <LayoutTemplate> <table id="Table1" runat="server" border="0" style=""> <tr runat="server" id="itemPlaceholder" /> </table> </LayoutTemplate> </asp:ListView> </div><asp:Button ID="Button1" runat="server" Text="Button" onclick="Button1_Click" />
后台代码
后台代码public partial class ListView技巧_Code13 : System.Web.UI.Page { DataAccess da; protected void Page_Load(object sender, EventArgs e) { if (Session["da"] == null) { da = new DataAccess(); Session["da"] = da; } else { da = Session["da"] as DataAccess; } if (!IsPostBack) { Bind(); } } private void Bind() { ListView1.DataSource = da.List; ListView1.DataBind(); } private void Export(string FileType, string FileName) { Response.Charset = "GB2312"; Response.ContentEncoding = System.Text.Encoding.UTF7; Response.AppendHeader("Content-Disposition", "attachment;filename=" + HttpUtility.UrlEncode(FileName, Encoding.UTF8).ToString()); Response.ContentType = FileType; this.EnableViewState = false; StringWriter tw = new StringWriter(); HtmlTextWriter hw = new HtmlTextWriter(tw); ListView1.RenderControl(hw); Response.Write(tw.ToString()); Response.End(); } protected void Button1_Click(object sender, EventArgs e) { Export("application/ms-excel", "employee.xls"); } }
6、高级分页
使用DataPager分页虽然简单但是对于大数据量时性能会成问题,因为这种分页仍然是一次性将数据载入到控件中的,暂时没找到使用DataPager好的解决方案,这里使用一个网上比较流行的开源的.net分页控件AspNetPager,下载地址为: http://www.webdiyer.com/
前端代码:
前端代码 <%@ Register Assembly="AspNetPager" Namespace="Wuqi.Webdiyer" TagPrefix="webdiyer" %><asp:ListView ID="ListView1" runat="server"> <LayoutTemplate> <table id="Table1" runat="server" border="0" style=""> <tr runat="server" id="itemPlaceholder" /> </table> </LayoutTemplate> <ItemTemplate> <tr> <td> <%#Eval("ID") %> </td> <td> <%# Eval("name") %> </td> <td> <%# Eval("age") %> </td> </tr> </ItemTemplate> </asp:ListView> <webdiyer:AspNetPager ID="AspNetPager1" runat="server" UrlPaging="false" ShowPageIndexBox="Always" PageIndexBoxType="DropDownList" ShowCustomInfoSection="Left" PageIndexBoxStyle="width:19px" CustomInfoHTML="共%PageCount%页,%RecordCount%条记录,当前第%CurrentPageIndex%页,每页显示%PageSize%条" HorizontalAlign="Center" PageSize="2" FirstPageText="首页" LastPageText="末页" NextPageText="下一页" PrevPageText="前一页" TextAfterPageIndexBox="页" TextBeforePageIndexBox="转到第" EnableTheming="true" OnPageChanging="AspNetPager1_PageChanging"> </webdiyer:AspNetPager>
后台代码:
后台代码public partial class ListView技巧_Code14 : System.Web.UI.Page { DataAccess da; protected void Page_Load(object sender, EventArgs e) { if (Session["da"] == null) { da = new DataAccess(); Session["da"] = da; } else { da = Session["da"] as DataAccess; } if (!IsPostBack) { Bind(); } } private void Bind() { ListView1.DataSource = da.GetEmployee(1,2); AspNetPager1.RecordCount = da.List.Count; ListView1.DataBind(); } protected void AspNetPager1_PageChanging(object src, Wuqi.Webdiyer.PageChangingEventArgs e) { ListView1.DataSource = da.GetEmployee(e.NewPageIndex*2-1, 2); ListView1.DataBind(); } }
模拟数据提供代码:
模拟数据提供代码public class DataAccess { public List<Employee> List; public DataAccess() { List = new List<Employee>(); List = new List<Employee>(); Employee e1 = new Employee { ID = 1, Name = "A", Age = 10, Sex = 1 }; Employee e2 = new Employee { ID = 3, Name = "M", Age = 30, Sex = 0 }; Employee e3 = new Employee { ID = 2, Name = "B", Age = 40, Sex = 1 }; Employee e4 = new Employee { ID = 4, Name = "S", Age = 19, Sex = 0 }; Employee e5 = new Employee { ID = 6, Name = "X", Age = 18, Sex = 1 }; Employee e6 = new Employee { ID = 5, Name = "W", Age = 20, Sex = 0 }; List.Add(e1); List.Add(e2); List.Add(e3); List.Add(e4); List.Add(e5); List.Add(e6); } public List<Employee> GetEmployee(int startIndex, int rowsCount) { List<Employee> listTemp = new List<Employee>(); for (int i = startIndex; i < startIndex+rowsCount; i++) { listTemp.Add(List[i-1]); } return listTemp; } }
7、内嵌DetailsView控件
前端代码
前端代码<asp:ListView ID="ListView1" runat="server" OnSelectedIndexChanging="ListView1_SelectedIndexChanging"> <LayoutTemplate> <table id="Table1" runat="server" border="0" style=""> <tr runat="server" id="itemPlaceholder" /> </table> </LayoutTemplate> <ItemTemplate> <tr> <td> <asp:LinkButton ID="SelectButton" CommandName="Select" runat="server" Text="Details" /> </td> <td> <%#Eval("ID") %> </td> <td> <asp:Label ID="idLabel" runat="server" Text='<%# Eval("name") %>' /> </td> <td> <asp:Label ID="xLabel" runat="server" Text='<%# Eval("age") %>' /> </td> </tr> </ItemTemplate> <SelectedItemTemplate> <tr><td> <asp:DetailsView ID="DetailsView1" runat="server" Height="50px" Width="125px"> </asp:DetailsView></td></tr> </SelectedItemTemplate> </asp:ListView>
后台代码:
后台代码public partial class ListView技巧_Code15 : System.Web.UI.Page { DataAccess da; protected void Page_Load(object sender, EventArgs e) { if (Session["da"] == null) { da = new DataAccess(); Session["da"] = da; } else { da = Session["da"] as DataAccess; } if (!IsPostBack) { Bind(); } } private void Bind() { ListView1.DataSource = da.List; ListView1.DataBind(); } protected void ListView1_SelectedIndexChanging(object sender, ListViewSelectEventArgs e) { ListView1.SelectedIndex = e.NewSelectedIndex; Bind(); DetailsView dv = ListView1.Items[e.NewSelectedIndex].FindControl("DetailsView1") as DetailsView; dv.DataSource = da.List; dv.DataBind(); } }
8、内嵌GridView带修改
前端代码
前端代码<asp:ListView ID="ListView1" runat="server" onselectedindexchanging="ListView1_SelectedIndexChanging"> <LayoutTemplate> <table id="Table1" runat="server" border="0" style=""> <tr runat="server" id="itemPlaceholder" /> </table> </LayoutTemplate> <ItemTemplate> <tr> <td> <asp:LinkButton ID="SelectButton" CommandName="Select" runat="server" Text="选择" /> </td> <td> <%#Eval("ID") %> </td> <td> <asp:Label ID="idLabel" runat="server" Text='<%# Eval("name") %>' /> </td> <td> <asp:Label ID="xLabel" runat="server" Text='<%# Eval("age") %>' /> </td> </tr> </ItemTemplate> <SelectedItemTemplate> <tr> <td> <asp:GridView ID="GridView1" runat="server" AutoGenerateEditButton="true" OnRowEditing="GridView1_Editing" OnRowUpdating="GridView1_Updating" OnRowCancelingEdit="GridView1_CancelingEdit" AutoGenerateColumns="false"> <Columns> <asp:BoundField DataField="ID" ReadOnly="true" /> <asp:BoundField DataField="name" /> <asp:BoundField DataField="Age" /> </Columns> </asp:GridView> </td> </tr> </SelectedItemTemplate> </asp:ListView>
后台代码
后台代码DataAccess da; protected void Page_Load(object sender, EventArgs e) { if (Session["da"] == null) { da = new DataAccess(); Session["da"] = da; } else { da = Session["da"] as DataAccess; } if (!IsPostBack) { Bind(); } } private void Bind() { ListView1.DataSource = da.List; ListView1.DataBind(); } protected void ListView1_SelectedIndexChanging(object sender, ListViewSelectEventArgs e) { ListView1.SelectedIndex = e.NewSelectedIndex; Bind(); ViewState["SelectedIndex"] = e.NewSelectedIndex; int selectIndex = (int)ViewState["SelectedIndex"]; GridView gv = (GridView)ListView1.Items[selectIndex].FindControl("GridView1"); gv.DataSource = da.List; gv.DataBind(); } protected void GridView1_Editing(object sender, GridViewEditEventArgs e) { int selectIndex = (int)ViewState["SelectedIndex"]; GridView gv = (GridView)ListView1.Items[selectIndex].FindControl("GridView1"); gv.EditIndex = e.NewEditIndex; gv.DataSource = da.List; gv.DataBind(); } protected void GridView1_Updating(object sender, GridViewUpdateEventArgs e) { int selectIndex = (int)ViewState["SelectedIndex"]; GridView gv = (GridView)ListView1.Items[selectIndex].FindControl("GridView1"); string id=gv.Rows[e.RowIndex].Cells[1].Text; string name= ((TextBox)gv.Rows[e.RowIndex].Cells[2].Controls[0]).Text; string Age= ((TextBox)gv.Rows[e.RowIndex].Cells[3].Controls[0]).Text; Employee employee = da.Find(Convert.ToInt32(id)); employee.Name = name; employee.Age = Convert.ToInt32(Age); gv.EditIndex = -1; gv.DataSource = da.List; gv.DataBind(); } protected void GridView1_CancelingEdit(object sender, GridViewCancelEditEventArgs e) { int selectIndex = (int)ViewState["SelectedIndex"]; GridView gv = (GridView)ListView1.Items[selectIndex].FindControl("GridView1"); gv.EditIndex = -1; gv.DataSource = da.List; gv.DataBind(); }
模拟数据提供和前边一样这里就不贴了
未完待续... ...
转载于:https://www.cnblogs.com/binyong/archive/2009/05/10/1453627.html
相关资源:数据结构—成绩单生成器