Phân trang trong ASP.NET với CollectionPager ~ Thủ Thuật Siêu Máy Tính

Khi lập trình ứng dụng ASP.NET, để trình bày dữ liệu, chúng ta hay sử dụng các control như DataList hay Repater khá nhiều so với Gridview hay các control dữ liệu khác. Ưu điểm của những control trên thì khá rõ, tuy nhiên có hạn chế là nhiều bạn gặp khó khăn để phân trang dữ liệu cho nó. Vấn đề này đặc biệt quan trọng khi dữ liệu của các bạn nhiều lên như danh sách các sản phẩm, danh sách nhân viên…..

Thật may mắn khi ASP.NET hỗ trợ chúng ta viết các custom control khá mạnh, chính vì thế có một control hỗ trợ phân trang rất linh hoạt và hữu ích là CollectionPager. Nó cho phép chúng ta phân trang với DataList, Repater, hỗ trợ định dạng hiển thị mạnh mẽ…

Để sử dụng các bạn cần download thư viện CollectionPager về.

Đầu tiên cần add thư viện CollectionPager.dll vào thư mục bin của ứng dụng.

Phân trang trong ASP.NET với CollectionPager

Tạo trang mới Pager.aspx

Các bạn chú ý thêm dòng này vào đầu trang

1
<%@ Register TagPrefix="cc1" Namespace="SiteUtils" Assembly="CollectionPager" %>

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
<!--/* FileName: Pager.aspx
Project Name: AjaxDemo
Date Created: 5/12/2015 8:49:08 PM
Description: Auto-generated
Version: 1.0.0.0
Author: Lê Thanh Tuấn - Khoa CNTT
Author Email: tuanitpro@gmail.com
Author Mobile: 0976060432
Author URI: http://tuanitpro.com
License: 
 
*/
-->
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Pager.aspx.cs" Inherits="Pager" %>
<%@ Register TagPrefix="cc1" Namespace="SiteUtils" Assembly="CollectionPager" %>
<!DOCTYPE html>
 
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>Phân trang với ColelctionPager</title>
</head>
<body>
    <form id="form1" runat="server">
        <div>
            <h1>Phân trang trong ASP.NET với CollectionPager</h1>
            <table>
                <thead>
                    <tr>
                        <th>StudentId</th>
                        <th>Name</th>
                        <th>Status</th>
                    </tr>
                </thead>
                <tbody>
                    <asp:Repeater ID="rptStudents" runat="server">
                        <ItemTemplate>
                            <tr>
                                <td><%#Eval("StudentId") %></td>
                                <td><%#Eval("Name") %></td>
                               <td> <%#Eval("Status") %></td>
                            </tr>
                        </ItemTemplate>
                    </asp:Repeater>
                </tbody>
                <tfoot>
                    <tr>
                        <td colspan="3">
                             <cc1:CollectionPager ID="pager" runat="server" PageSize="20" ></cc1:CollectionPager>
                        </td>
                    </tr>
                </tfoot>
            </table>
            <hr />
           <a href="http://tuanitpro.com">http://tuanitpro.com</a>
        </div>
    </form>
</body>
</html>
 

Thêm dòng này vào sau DataList, Repater

1
 <cc1:CollectionPager ID="pager" runat="server" PageSize="20" ></cc1:CollectionPager>

Các thuộc tinh của CollectionPager

Code trang Pager.aspx.cs

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
/* FileName: Pager.aspx.cs
Project Name: AjaxDemo
Date Created: 5/12/2015 8:49:08 PM
Description: Auto-generated
Version: 1.0.0.0
Author: Lê Thanh Tuấn - Khoa CNTT
Author Email: tuanitpro@gmail.com
Author Mobile: 0976060432
Author URI: http://tuanitpro.com
License: 
 
*/
 
using System;
using System.Data;
using System.Data.SqlClient;
 
public partial class Pager : System.Web.UI.Page
{
    string connectionString = @"Data Source = .\SQLEXPRESS; Initial Catalog = DemoDI; User ID=sa; Password=sa";
    // Code table Students
    string db = @"CREATE TABLE [dbo].[Students](
                 [StudentId] [int] IDENTITY(1,1) NOT NULL,
                 [Name] [nvarchar](max) NULL,
                 [Status] [nvarchar](max) NULL)";
    /// <summary>
    /// Get All Student form DB
    /// </summary>
    /// <returns></returns>
    public DataTable GetAllStudents()
    {
        using (SqlConnection cnn = new SqlConnection(connectionString))
        {
            cnn.Open();
            string sql = "Select * from Students";
            SqlCommand cmd = new SqlCommand(sql, cnn);
           
            DataTable table = new DataTable();
            table.Load(cmd.ExecuteReader());
            cnn.Close();
            return table;
        }
    }
    protected void Page_Load(object sender, EventArgs e)
    {
        if (!IsPostBack)
        {
            //Set DataSource of Pager to Sample Data 
            pager.DataSource = GetAllStudents().DefaultView;
 
            pager.BindToControl = rptStudents;
 
            rptStudents.DataSource = pager.DataSourcePaged;
             
        }
    }
}

Kết quả

Phân trang ASP.NET với CollectionPager

Chúc các bạn thành công.

Suu tam TUANIT.COM

Thủ Thuật Siêu Máy Tính

Phân trang trong ASP.NET với CollectionPager

0 nhận xét:

Đăng nhận xét