Kiến thức

Tìm kiếm
Hỗ trợ trực tuyến
Hỗ trợ trực tuyến - toankhoa1008
Mr.Khoa - 0909 017 015
Khuyến mãi
Khuyến mãi
Đối tác
Kiến thức thiết kế
Phân trang với Listview và Datapager trong asp.net
8/19/2012 10:27:00 AM
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

 

Cám ơn các bạn đã đọc bài viết này. Nếu bạn cảm thấy bài viết này hay và có ích thì hãy ấn +1 hoặc like để khích lệ tác giả bài viết nhé, và nếu được thì share cho bạn bè cùng đọc. Thanks ^o^

Bài viết liên quan


4/22/2012 2:11:39 PM
Một trong những bước quan trọng khi tiến hành tối ưu hoá website là sử dụng URL thân thiện với google. Trong bài viết này WEBXAULA sẽ giới t [....]
4/20/2012 11:49:27 AM
Trong các website thường có phần liên hệ để người dùng liên hệ với quản lý website đó. Trong bài viết này, WEBXAULA làm form liên hệ như WEB [....]
4/20/2012 11:17:54 AM
Khi xây dựng một website, nhiều khi bạn phải thực hiện lồng các control để hiển thị dữ liệu, vd như hiển thị các bài viết theo đúng danh mục [....]
4/17/2012 4:45:36 PM
reCaptcha là 1 dịch vụ giúp chúng ta có thể chống lại bot, và những submit không phải do con người (do engine). Bài viết này sẻ hướng dẫn cá [....]
4/17/2012 4:38:54 PM
Bạn nhận một đơn đặt hàng thiết kế website yêu cầu có một đồng hồ thời gian đếm ngược (VD: đấu giá, thời gian khuyến mãi, v.v...) nhưng làm [....]
4/17/2012 4:29:58 PM
Có khá nhiều cách để export dữ liệu ra file excel. WEBXAULA sẽ đơn cử một phương pháp khá đơn giản (không cần phải chèn thêm thư viện bên ng [....]
3/6/2012 6:34:18 PM
Không có một bí quyết nào về việc đẩy mạnh doanh số bán hàng qua Internet. Bạn thu hút sự chú ý của đông đảo mọi người và gia tăng các khách [....]
1 2
Doanh Nghiệp Tư Nhân TM DV TAHI TAKA
Văn phòng: G7, ấp Mỹ Hoà 2, xã Xuân Thới Đông, huyện Hóc Môn, TPHCM
Điện thoại: (84-8) 6250 1751 - 0909.017.015
Email: contact@webxaula.com - ktwebpro@gmail.com
Website: www.webxaula.com