Phân trang với Listview và Datapager trong asp.net

Phân trang với Listview và Datapager trong asp.net

Với số lượng dữ liệu quá nhiều không thể hiện lên hết trong 1 trang thì việc phân trang là một công việc chắc chắn phải làm. Có rất nhiều cách: Gridview đã được tích hợp sẵn chức năng phân trang hoặc có thể dùng CollectionPager để phân trang, v.v... Trong bài viết này WEBXAULA xin giới thiệu đến các bạn cách thức phân trang sử dụng Datapager đã được tích hợp sẵn trong Visual Studio 2010.

Phân trang với Listview và Datapager trong asp.net

Ở bài trước tôi đã giới thiệu với các bạn cách phân trang cho datalist, repeater v.v... bằng control CollectionPager (Phân trang dùng CollectionPager trong asp.net). Hôm nay tôi sẽ hướng dẫn các bạn cách phân trang sử dụng Listview để hiển thị dữ liệu và phân trang dữ liệu đó dùng Datapager. Datapager là control có sẵn trong Visual Studio 2010 nên bạn không cần phải add thêm bất kỳ thư viện nào bên ngoài.

Đầu tiên, bạn thiết kế Listview hiển thị dữ liệu như sau:

<asp:ListView ID="DS_Test" runat="server">
        <LayoutTemplate>
            <div id="itemPlaceholderContainer" style="width:100%;">
                <div runat="server" id="itemPlaceholder"></div>
            </div>
        </LayoutTemplate>
        <ItemTemplate>
            <div style="float:left; width:189px;">
 
                <img class="hinh_phim" src=<%# "../hinh/phim/thumb/" + Eval("hinh") %> />
                <div style="text-align:left; margin:5px 0px 0px 10px;">
                <%# Eval("tensanpham") %>
                </div>
            </div>
        </ItemTemplate>
        </asp:ListView>
 
Các bạn lưu ý phần LayoutTemplate giữ nguyên tên id, đó là thiết kế giao diện và dữ liệu sẽ được đổ vào đó. Các bạn có thể tuỳ biến sao cho phù hợp. Sau đó, các bạn thêm control Datapager thiết kế như sau:
 
<asp:DataPager ID="DataPager1" QueryStringField="page" PageSize="5" PagedControlID="DS_Test" runat="server">
        <Fields>
            <asp:NumericPagerField ButtonType="Link" />
            <asp:NextPreviousPagerField ButtonType="Link" RenderNonBreakingSpacesBetweenControls="true"
            FirstPageText="Trang đầu" LastPageText ="Trang cuối" NextPageText="Tiếp theo"
             PreviousPageText="Quay lại" ShowFirstPageButton="true" ShowLastPageButton="true"
              ShowNextPageButton="true" ShowPreviousPageButton="true" />
        </Fields>
    </asp:DataPager>
 
Các  bạn có thể tạo thêm CSS để cho control được đẹp mắt hơn.
 
Tiếp theo trong phần code ASP.NET bạn tiến hành code lấy dữ liệu và đổ dữ liệu cho Listview như bình thường. Như vậy là xong rồi. Chúc các bạn thành công
Bạn thấy bài viết này như thế nào?: 
Average: 10 (2 votes)
Ảnh của Tommy Tran

Tommy owner Express Magazine

Drupal Developer having 9+ year experience, implementation and having strong knowledge of technical specifications, workflow development. Ability to perform effectively and efficiently in team and individually. Always enthusiastic and interseted to study new technologies

  • Skype ID: tthanhthuy

Advertisement

 

jobsora

Dich vu khu trung tphcm

Dich vu diet chuot tphcm

Dich vu diet con trung

Quảng Cáo Bài Viết

 
Hướng dẫn làm No more View pages

Hướng dẫn làm No more View pages

Views has long been one of the magic pieces that makes Drupal my CMS of choice.  Views allows us to easily create queries of content in the 

Trang thời tiết Weather Channel’s Journey chuyển sang Drupal

Trang thời tiết Weather Channel’s Journey chuyển sang Drupal

When my business partner, Paul Chason, and I joined forces over seven years ago we had a rather simple vision for Mediacurrent.

Thuật ngữ Cloud computing là gì ?

Thuật ngữ Cloud computing là gì ?

Thuật ngữ “cloud computing” ra đời giữa năm 2007 không phải để nói về một trào lưu mới, mà để khái quát lại các hướng đi của cơ sở hạ tầng thông tin vốn đã và đang diễn ra từ mấy năm qua.

Công ty diệt chuột T&C

 

Diet con trung