Share Code Web - Chia sẻ niềm đam mê bất tận > Lập trình > ASP/ASP.Net > Tùy chỉnh kích thước cột của Gridview sử dụng Jquery
Tùy chỉnh kích thước cột của Gridview sử dụng Jquery
Nguyễn Trung Hiếu
Share Code Web Company 2012

Tùy chỉnh kích thước cột của Gridview sử dụng Jquery

Bài viết sau sẽ hướng dẫn các bạn làm thế nào có thể dùng chuột kéo thả độ rộng các cột đơn giản như làm việc trong excel

I. Introduction

Bài viết có sử dụng plugin Jquery là colResizable để thực hiện việc resizable các cột trong gridview

II. Using the code

Khi sử dụng plugin colResizable, độ rộng các cột của gridview sẽ được lưu trong cookies của plugin, do đó, asp.net sẽ không postback trở lại để reset độ rộng này nữa. Bây giờ thì bạn có thể download plugin theo đường dẫn bên trên và thêm Jquery, cookies, Javascript theo đường dẫn như sau:

Đoạn code dưới đây sẽ khởi tạo độ rộng của bảng được lấy từ cookies và plugin khi trang web được load thành công:

Tiếp theo, chúng ta xây dựng một hàm sự kiện để bắt sự kiện khi người dùng kéo thả độ rộng cột. Hàm này sẽ đọc độ rộng và lưu trở lại cookie.

Sau đó, thêm 1 gridview vào nữa:

Và cuối cùng, sản phẩm của chúng ta là đây:

Resizable các cột của gridview sử dụng jquery

Ngoài ra, nếu bạn nào không làm được, có thể download mã nguồn dưới đây để ngâm cứu nhé!

Download code

Related Posts

Tác giả: Nguyễn Trung Hiếu

Một blogger ... cùi bắp! Đơn giản: tôi muốn ghi lại những gì xảy ra xung quanh, cả công việc lẫn cuộc sống và chia sẻ với các bạn đọc. Nếu bạn cảm thấy bài viết có nhiều điểm không chính xác, hãy comment và chia sẻ để tôi còn được học hỏi từ những góp ý của bạn. Email: hieunt.dcn@gmail.com

Leave a comment

Bạn phải Đăng nhập để tham gia bình luận.

https://sharecodeweb.net/?s={search_term_string}

Blog Stats

  • 6.249 hits
%d bloggers like this: