Làm cách nào để cố định tiêu đề GridView?

Question

Như trong một tiêu đề, không ai biết làm thế nào để đóng băng tiêu đề GridView trong ASP.NET?

Answer 1

Tùy chọn (a) mua vào gói giao diện người dùng bao gồm GridView được tăng cường với chức năng này được tích hợp sẵn.

Tùy chọn (b) cuộn của riêng bạn - nó không đơn giản. Dino Esposito has one approach.

EDIT: Chỉ cần nhận thấy rằng bài viết Dino liên kết đến một khu vực chỉ dành cho người đăng ký trên trang web tạp chí ASPnetPro.

Đây là another approach sử dụng bộ mở rộng.

Answer 2

Bạn có thể làm điều đó trong css

Freeze Tiêu đề: 1. Xác định lớp .Freezing trong Stylesheet:

.Freezing 
{ 
    position:relative ; 
    top:expression(this.offsetParent.scrollTop); 
    z-index: 10; 
} 

CssClass

2.Assign Datagrid Tiêu đề để Freezing

Answer 3

Hãy cho thử này nên giải quyết vấn đề http://www.codeproject.com/KB/webforms/FreezePaneDatagrid.aspx

Answer 4

Hãy thử dự án mã nguồn mở này cho ASP.NET. Nó mở rộng GridView để cung cấp đầu trang, chân trang và máy nhắn tin cố định và chiều rộng cột có thể thay đổi kích thước. Hoạt động tốt trong IE 6/7/8, Firefox 3.0/3.5, Chrome và Safari.

http://johnsobrepena.blogspot.com/2009/09/extending-aspnet-gridview-for-fixed.html

Answer 5

Bạn có thể thử các mẫu sau

Freeze GridView Columns

Answer 6

tôi cũng phải đối mặt với một vấn đề tương tự khi phát triển trong các ứng dụng web trong Asp.Net 2.0/3.5.

Một ngày tốt đẹp, tôi đã xem qua IdeaSparks ASP.NET CoolControls. Nó giúp hiển thị tiêu đề cột cố định, chân trang và máy nhắn tin.

Tôi đã sử dụng chúng cá nhân và tôi thực sự yêu thích nó!

To check the control click here : IdeaSparks ASP.NET CoolControls

Hy vọng điều này sẽ hữu ích!

Answer 7

Tôi nghĩ mình có giải pháp này. xin vui lòng xem bên dưới mã javascript

<script type="text/javascript" language="javascript"> 
    var orgTop = 0; 
    $(document).scroll(function() { 
     var id = $("tr:.header").get(0); 
     var offset = $(id).offset(); 
     var elPosition = $(id).position(); 
     var elWidth = $(id).width(); 
     var elHeight = $(id).height(); 
     if (orgTop == 0) { 
      orgTop = elPosition.top; 
     } 
     if ($(window).scrollTop() <= orgTop) { 
      id.style.position = 'relative'; 
      id.style.top = 'auto'; 
      id.style.width = 'auto'; 
      id.style.height = 'auto'; 
     } 
     else { 
      id.style.position = 'absolute'; 
      id.style.top = $(window).scrollTop() + 'px'; 
      id.style.width = elWidth + 'px'; 
      id.style.height = elHeight + 'px'; 

     } 
    }); 
</script> 

nơi .header là lớp css header lưới của bạn.

Chỉ cần thêm tập lệnh này trên trang và thay thế header bằng tên lớp css bạn đã sử dụng cho tiêu đề của mình.