Kỹ thuật phân trang trong ASP.NET MVC sử dụng thư viện PagedList kết hợp Ajax

Hoàn thành việc phân trang một tập dữ liệu bằng PagedList kết hợp với Ajax dưới sự hướng dẫn của giảng viên Lại Đức Chung.

Giới thiệu
Phân trang dữ liệu là một kỹ thuật cơ bản mà hầu hết các lập trình viên khi làm việc với tập dữ liệu lớn cần sử dụng đến. Việc phân trang có thể thực hiện bằng nhiều cách như phân trang bằng thủ tục trong SQL Server rồi gọi ra từ ứng dụng, tự viết code phân trang sử dụng Linq trong C#, tuy nhiên để tiết kiệm thời gian thì chúng ta nên sử dụng những thư viện có sẵn, trong bài viết này tôi sẽ giới thiệu thư viện phân trang rất phổ biến trong ASP.NET MVC đó là PagedList, đồng thời tôi sẽ tích hợp Ajax vào PagedList để giảm tranffic khi tải dữ liệu về. Phiên bản sử dụng là Visual Studio 2015 và ASP.NET MVC 5.
Các bước thực hiện

a. Tạo 1 project ASP.NET MVC 5

b. Cài đặt gói PagedList.
Vào menu Tools chọn NuGet Package Manager chọn Package Manager Console. TạiPackage Manager Console bạn gõ lệnh như hình dưới và chờ cài đặt …

c. Cài đặt gói Ajax Helper
Tại Package Manager Console các bạn gõ tiếp lệnh như sau và chờ cài đặt….

d. Cấu hình CSS và AJAX
Mở tệp BundleConfig.cs trong thư mục App_Start và thêm vào 2 chuỗi đường dẫn như hình dưới.

e. Tạo lớp dữ liệu

Trong thư mục Models tạo lớp Customer như sau

f. Tạo Controller với tên CustomerController theo code theo gợi ý

g. Tạo View có tên “Index.cshtml” cho aciton Index với code gợi ý sau:

h. Tạo PartialView cho action GetPaging với tên “_PartialViewCustomer.cshtml” với code gợi ý sau:
Kết quả

Như vậy tôi đã hướng dẫn các bạn hoàn thành việc phân trang một tập dữ liệu bằng PagedList kết hợp với Ajax, chúc các bạn thành công, mọi thắc mắc xin gửi về địa chỉ email: chungld@bachkhoa-aptech.edu.vn

Bachkhoa-Aptech