WebGrid固定列(Fixed-Coloum)的设定

本文介绍了如何在WebGrid中设置固定列,以确保关键列在表格宽度不足时也不会随滚动条移动。通过示例展示了如何绑定WebGrid并设定列宽度,以保证关键信息始终可见。

        有时候WebGrid表格中列的数目比较多 ,若表格的宽度不足以显示所有列,当我们拉动左右滚动条就有可能看不见关键列。我们希望关键列不随着滚动条的移动而移动。

    比如我们创建如下Table用来描述每个学生各个科目的成绩:

        DataTable dt = new DataTable();
        dt.Columns.Add(
"姓名"typeof(string));
        dt.Columns.Add(
"科目1"typeof(double));
        dt.Columns.Add(
"科目2"typeof(double));
        dt.Columns.Add(
"科目3"typeof(double));
        dt.Columns.Add(
"科目4"typeof(double));
        dt.Columns.Add(
"科目5"typeof(double));
        dt.Columns.Add(
"科目6"typeof(double));
        dt.Columns.Add(
"科目7"typeof(double));

绑定WebGrid并设定宽度:

         //绑定表格
        this.UltraWebGrid1.DataSource = dt;
        
this.UltraWebGrid1.DataBind();
        
         
//设置表格宽度,明显小于各个列的总和
        this.UltraWebGrid1.Width = new Unit("300px");
        
this.UltraWebGrid1.Height = new Unit("300px");
        
        
//“姓名”列应当为我们的关键列,我们希望始终看见它
        this.UltraWebGrid1.Columns.FromKey("姓名").Width = new Unit("100px");

        
this.UltraWebGrid1.Columns.FromKey("科目1").Width = new Unit("50px");
        
this.UltraWebGrid1.Columns.FromKey("科目2").Width = new Unit("50px");
        
this.UltraWebGrid1.Columns.FromKey("科目3").Width = new Unit("50px");
        
this.UltraWebGrid1.Columns.FromKey("科目4").Width = new Unit("50px");
        
this.UltraWebGrid1.Columns.FromKey("科目5").Width = new Unit("50px");
        
this.UltraWebGrid1.Columns.FromKey("科目6").Width = new Unit("50px");
        
this.UltraWebGrid1.Columns.FromKey("科目7").Width = new Unit("50px");

这时我们运行程序,会看到它长的是这样的(老道我选择了一个样式,现在没有添加数据)

 

若想看到后面科目4~科目7就必须拉动滚动条,可这样我们就看不见姓名列,“这个得了100分的强人是谁啊?”,得,滚动条向左拉再慢慢找。
设置WebGrid的属性如下问题就解决了:
        //必须设定此属性为true.下面的Fixed的属性设定才有效
        this.UltraWebGrid1.DisplayLayout.UseFixedHeaders = true;

        
//如果你不是在代码中设定此属性,而是在设计器的属性窗口中设定,那么你必须先将上面的UseFixedHeaders设置为true,否则此属性的true值是无法选定的
        this.UltraWebGrid1.Columns.FromKey("姓名").Header.Fixed = true;
这样再向右拉动滚动条,“姓名”列也不会随着移动了。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值