五月综合缴情婷婷六月,色94色欧美sute亚洲线路二,日韩制服国产精品一区,色噜噜一区二区三区,香港三级午夜理伦三级三

您現(xiàn)在的位置: 365建站網(wǎng) > 365文章 > ASP.NET 3.5中的ListView控件和DataPager控件

ASP.NET 3.5中的ListView控件和DataPager控件

文章來源:365jz.com     點擊數(shù):504    更新時間:2009-09-13 10:59   參與評論

今天,我花了幾個小時的時間研究了一下ASP.NET 3.5中的ListView控件和DataPager控件。 這兩個控件是ASP.NET中新增的、非常受歡迎的控件。 ListView控件集成了DataGrid、DataList、Repeater和GridView控件的所有功能。 它可以像Repeater控件那樣,讓我們在控件內寫任何HTML代碼。
可以說,ListView就是DataGrid和Repeater的結合體,它既有Repeater控件的開放式模板,又具有DataGrid控件的編輯特性。 這絕對是一個可以引起你興趣的好東東,因為它給你提供了比DataGird豐富得多的布局手段,同時又具有DataGrid的所有特性。 ListView控件本身并不提供分頁功能,但是我們可以通過另一個控件 – DataPager來實現(xiàn)分頁的特性。 把分頁的特性單獨放到另一個控件里,會給我們帶來很多好處,比如說可以讓別的控件使用它,又比如說我們可以把它放在頁面的任何地方。 實質上,DataPager就是一個擴展ListView分頁功能的控件。
ListView控件
ListView是用來顯示數(shù)據(jù)的,它的使用類似于Repeater控件。 ListView控件中有n多模板,出示如下:
    ·LayoutTemplate 
    ·ItemTemplate 
    ·AlternatingItemTemplate 
    ·SelectedItemTemplate 
    ·EmptyItemTemplate 
    ·EmptyDataTemplate 
    ·ItemSeparatorTemplate 
    ·GroupTemplate 
    ·GroupSeparatorTemplate 
    ·EditItemTemplate 
    ·InsertItemTemplate
它有很多的模板。 其中有許多新增的模板,如GroupTemplate和InsertItemTemplate。 現(xiàn)在我們可能還無法了解GroupTemplate是如何工作的(后面會有介紹),但是對于InsertItemTemplate來說,一看就知道它是用于添加記錄的(在之前的DataGird中是沒有這個模板的)。
繼續(xù)摸索這個控件后,我發(fā)現(xiàn)它可以讓你在它的模板內寫任何HTML標記或控件,這將給我們帶來很大的自由度。
用ListView顯示數(shù)據(jù)
開始,你可以把ListView當作是Repeater來使用,也就是說它是模板驅動型的控件,其中的LayoutTemplate是ListView的一個布局模板。 參考如下示例:

<asp:ListView ID="lvItems" runat="server" 
              DataSourceID="Data" 
              ItemContainerID="layoutTemplate" 
              DataKeyNames="Pk" >
    <Layouttemplate>                
        <div id="layoutTemplate" runat="server" />                        
    </Layouttemplate>              
    <ItemTemplate>
        <div class="itemdisplay">
        <b><%Eval("Sku") %></b><br />
        <%Eval("Abstract") %></div>
    </ItemTemplate>
</asp:ListView>


LayoutTemplate用來決定包裹著詳細內容的容器的標記。 你可以在布局模板內放置任何控件,不過它必須要是服務端控件(runat=”server”)。 另外,你還需要指定ListView控件的ItemContainerID屬性,它用來告知ListView在哪個容器下顯示詳細內容。 在上面的例子中,LayoutTemplate其實并沒有起到什么作用,因為它只是將ListView顯示的詳細內容放到了一個<div />標記下而已。 但是,我們也可以用它來顯示復雜的布局,如<table />。 請看下面的例子,它就是用<table />來做ListView顯示的詳細內容的容器的,并且它還有一個固定表頭的功能。

<asp:ListView ID="lvItemsTable" runat="server" 
              DataSourceID="Data" 
              ItemContainerID="layoutTableTemplate" 
              DataKeyNames="Pk"              
>
    <LayoutTemplate>
        <div class="blackborder"  style="overflow-y:auto;height:500px;width:800px;">
        <table cellpadding="5" >
        <thead style="position:relative;">
        <tr class="gridheader" style="height:30px;">
            <th style="position:relative">Sku</th><th style="position:relative">Abstract</th>
        </tr>
        </thead>
        <tbody id="layoutTableTemplate" runat="server" 
               style="height:470px;overflow:scroll;overflow-x:hidden;"></tbody>
        </table>
        </div>
    </LayoutTemplate>
    <ItemTemplate>
       <tr style="height:0px;">
           <td valign="top"><%Eval("Sku") %> </td>
           <td valign="top"><%Eval("Abstract")  %></td>
       </tr>
    </ItemTemplate>
</asp:ListView>   


請注意一下上面的布局模板,特別是其中的<TBODY />部分。 ItemTemplate會將其內生成的詳細內容插入到<TBODY />之中。
增加分頁功能
如果你想為ListView增加分頁功能的話,那么就需要使用DataPager控件了。 這個分頁控件是一個獨立的控件,你可以把它放到頁面的任何位置,然后使其聯(lián)到你的ListView控件就可以完成分頁的工作了。 該分頁控件所呈現(xiàn)出來的HTML標記為內聯(lián)(Inline)元素,所以如果你想精確地設置其位置的話,可以參考下面的代碼,為其包裹一個<div />標記。
你可以像下面這樣設置分頁控件,并可以把其放到頁面的任何位置。

<div class="blockheader" style="padding:10px;text-align: right;">
    <asp:DataPager ID="Pager" runat="server"  
                   PagedControlID="lvItems" PageSize="5" >                      
        <Fields>
            <asp:numericpagerfield ButtonCount="10" NextPageText="" 
                PreviousPageText="" />
            <asp:nextpreviouspagerfield FirstPageText="First" LastPageText="Last" 
                NextPageText="Next" PreviousPageText="Previous" />
        </Fields>
    </asp:DataPager>
</div>

通過上面的代碼你會發(fā)現(xiàn),我們可以通過設置DataPager控件的Fields,從而達到手動設置分頁布局的目的。 另外還有一個關鍵點,就是DataPager控件的PagedControlID屬性,你需要把它設置為ListView的ID。
當然你也可以把DataPager控件放到布局模板內。
把分頁功能作為一個單獨的控件分離出來是一個非常好的注意 – 它會讓我們有更多的布局和 顯示上的自由度。 但是,目前的分頁控件還是有其局限性的。 它只能結合ListView控件一起工作 – 如果能用在Repeater或GridView上就更好了。 另外,它也是要依賴于ViewState的。
還有,現(xiàn)在的DataPager控件沒有分頁事件,也沒有SelectedPageIndex屬性。
還有一點需要注意的是,ListView沒有內置排序功能。
在ListView中添加和編輯數(shù)據(jù)
ListView通過EditItemTemplate和InsertItemTemplate來提供編輯數(shù)據(jù)和添加數(shù)據(jù)的功能。 這個功能的使用非常類似于GridView的編輯特性的使用,只不過它用的都是自定義模板。

<asp:ListView ID="lvItems" runat="server" 
              DataSourceID="Data" 
              ItemContainerID="layoutTemplate" 
              DataKeyNames="Pk"
              InsertItemPosition="None"               
>
    <Layouttemplate>                
        <div id="layoutTemplate" runat="server" />                        
    </Layouttemplate>        
        
    <ItemTemplate>
        <div class="itemdisplay">
        <b><%Eval("Sku") %></b><br />
        <%Eval("Abstract") %></div>
        
        <asp:Button ID="Button1" runat="server" CommandName="Edit" Text="Edit" />
        <asp:Button ID="Button2" runat="server" CommandName="Delete" Text="Delete" />
    </ItemTemplate>
    <AlternatingItemTemplate >
        <div class="itemdisplayalternate">
        <b><%Eval("Sku") %></b><br />
        <%Eval("Abstract") %></div>
        <asp:Button ID="Button1" runat="server" CommandName="Edit" Text="Edit" />
        <asp:Button ID="Button2" runat="server" CommandName="Delete" Text="Delete" />
    </AlternatingItemTemplate>
    <EditItemTemplate>
        <div class="gridalternate">
        Sku: <asp:TextBox runat="server" ID="txtSku" Text='<%# Bind("Sku") %>'></asp:TextBox>
        <br />
        Abstract: <asp:TextBox  runat="server" id="txtAbstract" Text='<%# Bind("Abstract") %>'></asp:TextBox>
        <br />
        <asp:Button ID="Button3" runat="server" CommandName="Update" Text="Update" />
        <asp:Button ID="Button4" runat="server"
                    CommandName="Cancel" Text="Cancel" /><br />
         </div>
    </EditItemTemplate>
    <InsertItemTemplate>
        <div style="background:Yellow">
        <asp:TextBox runat="server" ID="txtSku" Text='<%# Bind("Sku") %>'></asp:TextBox>
        <br />
        <asp:TextBox  runat="server" id="txtAbstract" Text='<%# Bind("Abstract") %>'></asp:TextBox>
        <br />
        </div>
        <asp:Button ID="Button3" runat="server" CommandName="Inser" Text="Insert" />
        <asp:Button ID="Button4" runat="server"
                    CommandName="Cancel" Text="Cancel" /><br />
    </InsertItemTemplate>            
</asp:ListView>


在本例中我使用的是SqlDataSource(我比較懶),SqlDataSource中的Insert和Update語句是你必須要提供的。 InsertItemTemplate是ListView中新增的非常受歡迎的模板,我們可以把它的UI設置成與編輯模板相一致。 我們還可以通過InsertItemPosition屬性來指定插入模板的位置,它可以是FirstItem、LastItem或None。 一般來說,應該把它設置為None,然后通過某個按鈕來設置插入模板的顯示位置(FirstItem或LastItem)。示例代碼如下:

protected void btnAddItem_Click(object sender, EventArgs e)
{
    this.lvItems.InsertItemPosition = InsertItemPosition.FirstItem;
}

protected void lvItems_ItemCommand(object sender, ListViewCommandEventArgs e)
{
    if (e.CommandName == "Update")
    {
        TextBox tb = e.Item.FindControl("txtSku") as TextBox;
        this.lvItems.InsertItemPosition = InsertItemPosition.None;
        Response.Write(tb.Text);
    }
    if (e.CommandName == "Cancel")
    {
        this.lvItems.InsertItemPosition = InsertItemPosition.None;
    }   
    
}


你可以在OnItemCommand中寫上自己的邏輯,使得一旦執(zhí)行了Update或Cancel命令就設置InsertItemPosition為None。
分組
大概介紹一下,最后生成的HTML代碼會先用GroupTemplate分組,然后再以LayoutTemplate做容器包裹起來。

    <Layouttemplate>                
        <div id="groupContainer" runat="server" >                                
        </div>
    </Layouttemplate> 
    <GroupTemplate>        
        <div class="blockheader" style="height:23px;padding:7px">Group Header:</div>
        <div id="layoutTemplate" runat="server" />                        
    </GroupTemplate> 


你可以設置ListView的GroupItemCount屬性,來指定每組顯示多少條記錄。

總結
ListView是ASP.NET中新增的一個非??岬目丶?。 在本文中我已經介紹過了,相對于GridView來說它有著更為豐富的布局手段,你可以在它的模板內寫任何HTML標記或者控件。 如果你使用過Repeater和GridView的話,那么你將會輕松的上手ListView,不過很明顯地,你也將要手寫更多的HTML標記。 但是,它也將會給我們帶來更多的布局上的自由度,同時也具有編輯、插入等特性。 這就是ASP.NET 3.5給我們帶來的非常棒的控件。

如對本文有疑問,請?zhí)峤坏浇涣髡搲瑥V大熱心網(wǎng)友會為你解答??! 點擊進入論壇

發(fā)表評論 (504人查看,0條評論)
請自覺遵守互聯(lián)網(wǎng)相關的政策法規(guī),嚴禁發(fā)布色情、暴力、反動的言論。
昵稱:
最新評論
------分隔線----------------------------

其它欄目

· 建站教程
· 365學習

業(yè)務咨詢

· 技術支持
· 服務時間:9:00-18:00
365建站網(wǎng)二維碼

Powered by 365建站網(wǎng) RSS地圖 HTML地圖

copyright © 2013-2024 版權所有 鄂ICP備17013400號