因為在asp.net 3.5 的狀況下 ListView沒有提供分頁的功能。
一般的做法都是用以下兩種方式:
(1)ListView + DataPager + LinqDataSource
(2)ListView + DataPager + SQLDataSource
但因為資料來源不是從LinqDataSource或SQLDataSource取得,所以使用DataPager 造成很多不必要的麻煩,改用ListView +GridView 的方式,雖然會浪費資源及效能但同樣可以執成同樣的效果。
一、ASPX新增及建立
1.GridView 的相關設定,並且在Columns新增一個項目,利用CSS做隱藏
<pre class='codeblock'>
<asp:GridView ID="GridView1" runat="server" AllowPaging="True" AutoGenerateColumns="False" GridLines ="None" onpageindexchanging="GridView1_PageIndexChanging" onrowdatabound="GridView1_RowDataBound" >
<PagerSettings FirstPageText="_FirstPage" LastPageText="_LastPage" Mode="NumericFirstLast" NextPageText="_NextPage" PreviousPageText="_PreviousPage" PageButtonCount="2" />
<Columns>
<asp:BoundField DataField="Name" HeaderText="Name" SortExpression="Name"
ReadOnly="True" ItemStyle-cssclass="hiddencol" HeaderStyle-CssClass="hiddencol">
<HeaderStyle CssClass="hiddencol"></HeaderStyle>
<ItemStyle CssClass="hiddencol"></ItemStyle>
</Columns>
<FooterStyle HorizontalAlign ="Left" />
<PagerStyle HorizontalAlign="Center" Font-Size="10" BackColor="#ffffff" ForeColor="#0072BC" Wrap="False" CssClass="PagerCss"></PagerStyle>
</asp:GridView>
</pre>
2.增加CSS
<pre class='codeblock'>
<style type="text/css">
.hiddencol
{
display:none;
}
.viscol
{
display:block;
}
.PagerCss TD A:hover { width: 20px; color: blue; }
.PagerCss TD A:active { width: 20px; color: black; }
.PagerCss TD A:link {width: 20px; color: Green;}
.PagerCss TD A:visited { width: 20px; color:black ; }
.PagerCss TD SPAN { font-weight: bold; font-size: 25px; width: 20px; color: red; background-color:Silver ; }
</style>
</pre>
3.ListView相關設定
<pre class='codeblock'>
<asp:ListView ID="ListView1" runat="server" onitemdatabound="ListView1_ItemDataBound">
<LayoutTemplate>
<span ID="itemPlaceholder" runat="server"></span>
</LayoutTemplate>
<ItemTemplate>
<asp:Label ID="Name" runat="server" Text='<%# Eval("Name") %>'></asp:Label>
</ItemTemplate>
</asp:ListView>
</pre>
二、Code Behind新增及建立
1.建立全域變數的DataTable 及DataView
<pre class='codeblock'>
public partial class Page : System.Web.UI.UserControl
{
public DataTable dt= new DataTable();
public DataView dv = new DataView();
}
</pre>
2.建立DataTable 的結構,並取得資料來源。
<pre class='codeblock'>
protected void Page_Load(object sender, EventArgs e)
{
dt.Columns.Add("Name");
dv = dt.DefaultView;
DataView dvSource = GetSource();
GridView1.DataSource = dvSource ;
GridView1.DataBind();
ListView1.DataSource = dv;
ListView1.DataBind();
}
</pre>
3.
<pre class='codeblock'>
protected void GridView1_RowDataBound(object sender, GridViewRowEventArgs e)
{
if (e.Row.RowType == DataControlRowType.DataRow)
{
DataRow dr = dv.Table.NewRow();
dr["Name"] = DataBinder.Eval(e.Row.DataItem, "Name") as string;
dv.Table.Rows.Add(dr);
}
}
protected void GridView1_PageIndexChanging(object sender, GridViewPageEventArgs e)
{
GridView1.EditIndex = -1;
GridView1.PageIndex = e.NewPageIndex;
dt.Columns.Add("Name");
dv = dt.DefaultView;
DataView dvSource = GetSource();
GridView1.DataSource = dvSource ;
GridView1.DataBind();
ListView1.DataSource = dv;
ListView1.DataBind();
}
protected void ListView1_ItemDataBound(object sender, ListViewItemEventArgs e)
{
Label Name = (e.Item.FindControl("Name") as Label);
string Name = DataBinder.Eval(dataItem.DataItem, "Name ").ToString();
}
</pre>
參考資料 :
http://charlesbc.blogspot.tw/2010/05/iqueryable-gridview-rowdatabound.html
http://www.dotblogs.com.tw/dennismao/archive/2009/08/10/9977.aspx?fid=16726
http://kennyfan88.pixnet.net/blog/post/84881604-%E4%BD%BF%E7%94%A8datatable%E5%8A%A0%E5%85%A5%E6%AC%84%E4%BD%8D%E3%80%81%E6%96%B0%E5%A2%9E%E6%AC%84%E4%BD%8D%E5%90%84%E8%B3%87%E6%96%99%E5%88%97
0 意見: