Asp.net锁定/冻结多行Gridview标题 [英] Asp.net Lock/Freeze Multi Row Gridview Headers

查看：133
本文介绍了Asp.net锁定/冻结多行Gridview标题的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

问题描述

我一直在冻结GridView上的标题。 Gridview也必须是可滚动的。我已经完成了滚动功能。我无法获得锁头功能。我已经尝试了各种解决方案，包括CSS样式和JQuery插件，但似乎没有任何工作。我认为最大的问题是我的Gridview有一个多行标题。我在aspx中定义了一个行标题，然后在Gridview行数据绑定事件中创建了第二个行标题。任何有用的解决方案？




$ b pre> < div style =height：95％; overflow-y：auto;>
< RowStyle BackColor =＃E5F2FFCssClass =rowHeight/>
< AlternatingRowStyle BackColor =White/>
<列>
< asp：BoundField DataField =实际存储间隙
HeaderText =实际间隙DataFormatString ={0：##，###，## 0}ItemStyle-Horizo​​ntalAlign =Right HeaderStyle-BorderWidth =1ItemStyle-BorderWidth =1/>
< asp：BoundField DataField =存储清除总数HeaderText =清除总数DataFormatString ={0：##，###，## 0}ItemStyle-Horizo​​ntalAlign =RightHeaderStyle-BorderWidth =1ItemStyle-BorderWidth =1/>
HeaderText =下个月清算估算值DataFormatString ={0：##，### ，## 0}ItemStyle-Horizo​​ntalAlign =RightHeaderStyle-BorderWidth =1ItemStyle-BorderWidth =1/>
< asp：BoundField DataField =Stores blankItemStyle-Width =0.5％ItemStyle-BackColor =＃F8F8F8ItemStyle-BorderStyle =NoneHeaderStyle-BorderStyle =NoneHeaderStyle-BackColor = ＃F8F8F8/>

< asp：BoundField DataField =COM Clearance Actual
HeaderText =Clearance ActualDataFormatString ={0：##，###，## 0}ItemStyle- Horizo​​ntalAlign =RightHeaderStyle-BorderWidth =1ItemStyle-BorderWidth =1/>
< asp：BoundField DataField =COM Clearance EstimateHeaderText =Clearance EstimateDataFormatString ={0：##，###，## 0}ItemStyle-Horizo​​ntalAlign =RightHeaderStyle-BorderWidth =1ItemStyle-BorderWidth =1/>
< asp：BoundField DataField =COM Clearance TotalHeaderText =Clearance TotalDataFormatString ={0：##，###，## 0}ItemStyle-Horizo​​ntalAlign =RightHeaderStyle-BorderWidth =1ItemStyle-BorderWidth =1/>
< asp：BoundField DataField =COM POS ActualHeaderText =POS ActualItemStyle-Width =4％DataFormatString ={0：##，###，## 0}ItemStyle- Horizo​​ntalAlign =RightHeaderStyle-BorderWidth =1ItemStyle-BorderWidth =1/>
HeaderText =Next Month Clearance EstimateDataFormatString ={0：##，### ，## 0}ItemStyle-Horizo​​ntalAlign =RightHeaderStyle-BorderWidth =1ItemStyle-BorderWidth =1/>
< asp：BoundField DataField =COM blankItemStyle-Width =0.5％ItemStyle-BackColor =＃F8F8F8ItemStyle-BorderStyle =NoneHeaderStyle-BorderStyle =NoneHeaderStyle-BackColor = ＃F8F8F8/>

HeaderText =Clearance ActualDataFormatString ={0：##，###，## 0}ItemStyle- Horizo​​ntalAlign =RightHeaderStyle-BorderWidth =1ItemStyle-BorderWidth =1/>
< asp：BoundField DataField =Company Clearance TotalHeaderText =Clearance TotalDataFormatString ={0：##，###，## 0}ItemStyle-Horizo​​ntalAlign =RightHeaderStyle-BorderWidth =1ItemStyle-BorderWidth =1/>
< asp：BoundField DataField =Company Other ActualHeaderText =Other-MDAItemStyle-Width =5％DataFormatString ={0：##，###，## 0}ItemStyle -Horizo​​ntalAlign =RightHeaderStyle-BorderWidth =1ItemStyle-BorderWidth =1/>
< /列>
< / asp：GridView>
< / div>

后面的代码 

  protected void markupGrid_RowDataBound（object sender，GridViewRowEventArgs e）
 {
 if（e.RowType == DataControlRowType.Header）
 {
 if（dateSelection。 Text！= null）
 {
 e.Row.Cells [0] .Text = dateSelection.Text; 
} 
 
 GridViewRow headerow = new GridViewRow（0，0，DataControlRowType.Header，
 DataControlRowState.Insert）; 
 TableCell headercell = new TableCell（）
 {
 //第一个空白单元格
 Text =PTD，
 ForeColor = Color.Red，
 Horizo​​ntalAlign = Horizo​​ntalAlign.Center，
 BorderWidth = 1，
 BorderColor = Color.Black，
 CssClass =gridSectionHeaders
}; 
 headerow.Cells.Add（headercell）; 
 
 headercell = new TableCell（）
 {
 //全部销售地点header 
 ColumnSpan = 2，
 Text =总销售地点，
 Horizo​​ntalAlign = Horizo​​ntalAlign.Center，
 BorderWidth = 1，
 CssClass =gridSectionHeaders
}; 
 headerow.Cells.Add（headercell）; 
 
 headercell = new TableCell（）
 {
 //第二个空格
 BackColor = ColorTranslator.FromHtml（＃F8F8F8），
 BorderWidth = 0 
}; 
 headerow.Cells.Add（headercell）; 
 
 headercell = new TableCell（）
 {
 // COM header 
 Text =COM，
 ColumnSpan = 2，
 Horizo​​ntalAlign = Horizo​​ntalAlign.Center，
 BorderWidth = 1，
 CssClass =gridSectionHeaders
}; 
 headerow.Cells.Add（headercell）; 
 
 headercell = new TableCell（）
 {
 //最后一个空白单元格
 BackColor = ColorTranslator.FromHtml（＃F8F8F8），
 BorderWidth = 0 
}; 
 headerow.Cells.Add（headercell）; 
 
 headercell = new TableCell（）
 {
 // TOTAL header 
 ColumnSpan = 3，
 Text =TOTAL，
 Horizo​​ntalAlign = Horizo​​ntalAlign.Center，
 BorderWidth = 1，
 CssClass =gridSectionHeaders
}; 
 
 headerow.Cells.Add（headercell）; 
 headercell.Height = 20; 
 markupGrid.Controls [0] .Controls.AddAt（0，headerow）; 
} 
}


解决方案

I认为您正在寻找此。



以下是我在应用程序中使用它的方式，它没有任何问题。请参阅我的其他答案此处和此处对于类似问题的SO 

 < script type =text / javascriptsrc =http://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min。 JS>< /脚本> 
< script type =text / javascriptsrc =http://ajax.googleapis.com/ajax/libs/jqueryui/1.9.1/jquery-ui.min.js>< /脚本> 
< script type =text / javascriptsrc =gridviewScroll.min.js>< / script> 
< link href =GridviewScroll.css =stylesheet/> 
 
函数pageLoad（sender，args）{
 gridviewScroll（）; 
} 
 
函数gridviewScroll（）{
 gridView1 = $（'＃GridView1'）。gridviewScroll（{
 width：915，
 height：449 ，
 railcolor：＃F0F0F0，
 barcolor：#CDCDCD，
 barhovercolor：＃606060，
 bgcolor：＃F0F0F0，
 freezesize ：5，
 arrowsize：30，
 varrowtopimg：../../../images/arrowvt.png，
 varrowbottomimg：../../../ images / arrowvb.png，
 harrowleftimg：../../../images/arrowhl.png，
 harrowrightimg：../../../images/arrowhr。 png，
 headerrowcount：1，
 onScrollVertical：function（delta）{
 //将隐藏字段中的滚动偏移量存储在此函数外部，如果要保持垂直滚动位置
}，
 onScrollHorizo​​ntal：function（delta）{
 //将该函数外的滚动偏移量存储在隐藏字段中，如果要保持水平scr OLL position 
} 
}）; 
}

然后在屏幕上打印冻结网格标题在我的应用程序中的外观


I've been giving the task of freezing the headers on my Gridview. The Gridview must also be scrollable. I have accomplished the scrolling feature. I can't get the lock header feature. I've tried various solutions including css styles and JQuery plugins but nothing seems to be working. I think the biggest is that my Gridview has a multi row header. I define one row header in the aspx, then I created the second row header in the Gridview row data bound event. Any useful solutions?

Code Below

aspx

<div style="height: 95%; overflow-y: auto;">
                    <asp:GridView ID="markdownGrid" runat="server" AutoGenerateColumns="false" BackColor="White" RowStyle-Height="15" HeaderStyle-Height="20" HeaderStyle-Font-Size="small" HeaderStyle-Font-Names="Calibri" RowStyle-Font-Names="Calibri" RowStyle-Font-Size="13px" BorderWidth="0" OnRowDataBound="markdownGrid_RowDataBound" AllowPaging="false" OnPageIndexChanging="markdownGrid_PageIndexChanging" GridLines="Both" >
                        <RowStyle BackColor="#E5F2FF" CssClass="rowHeight" />
                        <AlternatingRowStyle BackColor="White" />
                        <Columns>
                            <asp:BoundField DataField="Row Header" HeaderText="" ItemStyle-Width="9%" ItemStyle-HorizontalAlign="Left" ItemStyle-Font-Bold="true" HeaderStyle-BorderWidth="1" ItemStyle-BorderWidth="1" />
                            <asp:BoundField DataField="Stores Clearance Actual"
                                HeaderText="Clearance Actual" DataFormatString="{0:##,###,##0}" ItemStyle-HorizontalAlign="Right" HeaderStyle-BorderWidth="1" ItemStyle-BorderWidth="1" />
                            <asp:BoundField DataField="Stores Clearance Estimate" HeaderText="Clearance Estimate" DataFormatString="{0:##,###,##0}" ItemStyle-HorizontalAlign="Right" HeaderStyle-BorderWidth="1" ItemStyle-BorderWidth="1" />
                            <asp:BoundField DataField="Stores Clearance Total" HeaderText="Clearance Total" DataFormatString="{0:##,###,##0}" ItemStyle-HorizontalAlign="Right" HeaderStyle-BorderWidth="1" ItemStyle-BorderWidth="1" />
                            <asp:BoundField DataField="Stores POS Actual" HeaderText="POS Actual" ItemStyle-Width="4%" DataFormatString="{0:##,###,##0}" ItemStyle-HorizontalAlign="Right" HeaderStyle-BorderWidth="1" ItemStyle-BorderWidth="1" />
                            <asp:BoundField DataField="Stores MD Total" HeaderText="MD Total" ItemStyle-Width="4%" DataFormatString="{0:##,###,##0}" ItemStyle-HorizontalAlign="Right" HeaderStyle-BorderWidth="1" ItemStyle-BorderWidth="1" />
                            <asp:BoundField DataField="Stores Next Month Clearance Estimate" ItemStyle-Width="4%"
                                HeaderText="Next Month Clearance Estimate" DataFormatString="{0:##,###,##0}" ItemStyle-HorizontalAlign="Right" HeaderStyle-BorderWidth="1" ItemStyle-BorderWidth="1" />
                            <asp:BoundField DataField="Stores blank" ItemStyle-Width="0.5%" ItemStyle-BackColor="#F8F8F8" ItemStyle-BorderStyle="None" HeaderStyle-BorderStyle="None" HeaderStyle-BackColor="#F8F8F8" />

                            <asp:BoundField DataField="COM Clearance Actual"
                                HeaderText="Clearance Actual" DataFormatString="{0:##,###,##0}" ItemStyle-HorizontalAlign="Right" HeaderStyle-BorderWidth="1" ItemStyle-BorderWidth="1" />
                            <asp:BoundField DataField="COM Clearance Estimate" HeaderText="Clearance Estimate" DataFormatString="{0:##,###,##0}" ItemStyle-HorizontalAlign="Right" HeaderStyle-BorderWidth="1" ItemStyle-BorderWidth="1" />
                            <asp:BoundField DataField="COM Clearance Total" HeaderText="Clearance Total" DataFormatString="{0:##,###,##0}" ItemStyle-HorizontalAlign="Right" HeaderStyle-BorderWidth="1" ItemStyle-BorderWidth="1" />
                            <asp:BoundField DataField="COM POS Actual" HeaderText="POS Actual" ItemStyle-Width="4%" DataFormatString="{0:##,###,##0}" ItemStyle-HorizontalAlign="Right" HeaderStyle-BorderWidth="1" ItemStyle-BorderWidth="1" />
                            <asp:BoundField DataField="COM MD Total" HeaderText="MD Total" ItemStyle-Width="4%" DataFormatString="{0:##,###,##0}" ItemStyle-HorizontalAlign="Right" HeaderStyle-BorderWidth="1" ItemStyle-BorderWidth="1" />
                            <asp:BoundField DataField="COM Next Month Clearance Estimate" ItemStyle-Width="4%"
                                HeaderText="Next Month Clearance Estimate" DataFormatString="{0:##,###,##0}" ItemStyle-HorizontalAlign="Right" HeaderStyle-BorderWidth="1" ItemStyle-BorderWidth="1" />
                            <asp:BoundField DataField="COM blank" ItemStyle-Width="0.5%" ItemStyle-BackColor="#F8F8F8" ItemStyle-BorderStyle="None" HeaderStyle-BorderStyle="None" HeaderStyle-BackColor="#F8F8F8" />

                            <asp:BoundField DataField="Company Clearance Actual"
                                HeaderText="Clearance Actual" DataFormatString="{0:##,###,##0}" ItemStyle-HorizontalAlign="Right" HeaderStyle-BorderWidth="1" ItemStyle-BorderWidth="1" />
                            <asp:BoundField DataField="Company Clearance Estimate" HeaderText="Clearance Estimate" DataFormatString="{0:##,###,##0}" ItemStyle-HorizontalAlign="Right" HeaderStyle-BorderWidth="1" ItemStyle-BorderWidth="1" />
                            <asp:BoundField DataField="Company Clearance Total" HeaderText="Clearance Total" DataFormatString="{0:##,###,##0}" ItemStyle-HorizontalAlign="Right" HeaderStyle-BorderWidth="1" ItemStyle-BorderWidth="1" />
                            <asp:BoundField DataField="Company POS Actual" HeaderText="POS Actual" ItemStyle-Width="4%" DataFormatString="{0:##,###,##0}" ItemStyle-HorizontalAlign="Right" HeaderStyle-BorderWidth="1" ItemStyle-BorderWidth="1" />
                            <asp:BoundField DataField="Company Other Actual" HeaderText="Other-MDA" ItemStyle-Width="5%" DataFormatString="{0:##,###,##0}" ItemStyle-HorizontalAlign="Right" HeaderStyle-BorderWidth="1" ItemStyle-BorderWidth="1" />
                            <asp:BoundField DataField="Company MD Total" HeaderText="MD Total" ItemStyle-Width="4%" DataFormatString="{0:##,###,##0}" ItemStyle-HorizontalAlign="Right" HeaderStyle-BorderWidth="1" ItemStyle-BorderWidth="1" />
                            <asp:BoundField DataField="Company LY Clearance" HeaderText="LY Clearance EOW" DataFormatString="{0:##,###,##0}" ItemStyle-HorizontalAlign="Right" HeaderStyle-BorderWidth="1" ItemStyle-BorderWidth="1" />
                            <asp:BoundField DataField="Company Next Month Clearance Estimate" ItemStyle-Width="4%" HeaderText="Next Month Clearance Estimate" DataFormatString="{0:##,###,##0}" ItemStyle-HorizontalAlign="Right" HeaderStyle-BorderWidth="1" ItemStyle-BorderWidth="1" />
                        </Columns>
                    </asp:GridView>
                </div>

code behind

protected void markupGrid_RowDataBound(object sender, GridViewRowEventArgs e)
    {
        if (e.Row.RowType == DataControlRowType.Header)
        {
            if (dateSelection.Text != null)
            {
                e.Row.Cells[0].Text = dateSelection.Text;
            }

            GridViewRow headerow = new GridViewRow(0, 0, DataControlRowType.Header,
                                                      DataControlRowState.Insert);
            TableCell headercell = new TableCell()
            {
                // First blank cell                    
                Text = "PTD",
                ForeColor = Color.Red,
                HorizontalAlign = HorizontalAlign.Center,
                BorderWidth = 1,
                BorderColor = Color.Black,
                CssClass = "gridSectionHeaders"
            };
            headerow.Cells.Add(headercell);

            headercell = new TableCell()
            {
                // TOTAL SELLING LOCATIONS header
                ColumnSpan = 2,
                Text = "TOTAL SELLING LOCATIONS",
                HorizontalAlign = HorizontalAlign.Center,
                BorderWidth = 1,
                CssClass = "gridSectionHeaders"
            };
            headerow.Cells.Add(headercell);

            headercell = new TableCell()
            {
                // Second blank cell
                BackColor = ColorTranslator.FromHtml("#F8F8F8"),
                BorderWidth = 0
            };
            headerow.Cells.Add(headercell);

            headercell = new TableCell()
            {
                // COM header
                Text = "COM",
                ColumnSpan = 2,
                HorizontalAlign = HorizontalAlign.Center,
                BorderWidth = 1,
                CssClass = "gridSectionHeaders"
            };
            headerow.Cells.Add(headercell);

            headercell = new TableCell()
            {
                // Last blank cell
                BackColor = ColorTranslator.FromHtml("#F8F8F8"),
                BorderWidth = 0
            };
            headerow.Cells.Add(headercell);

            headercell = new TableCell()
            {
                // TOTAL header
                ColumnSpan = 3,
                Text = "TOTAL",
                HorizontalAlign = HorizontalAlign.Center,
                BorderWidth = 1,
                CssClass = "gridSectionHeaders"
            };

            headerow.Cells.Add(headercell);
            headercell.Height = 20;
            markupGrid.Controls[0].Controls.AddAt(0, headerow);
        }
    }

解决方案

I think you are looking for this.

Here is how I use it in my application and it works without any issues. Refer my others answers here and here on SO for the similar problem

<script type="text/javascript"      src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.9.1/jquery-ui.min.js"></script>
<script type="text/javascript" src="gridviewScroll.min.js"></script>
<link href="GridviewScroll.css" rel="stylesheet" />

function pageLoad(sender, args) {
   gridviewScroll ();
 }

 function gridviewScroll() {
    gridView1 = $('#GridView1').gridviewScroll({
       width: 915,
       height: 449,
       railcolor: "#F0F0F0",
       barcolor: "#CDCDCD",
       barhovercolor: "#606060",
       bgcolor: "#F0F0F0",
       freezesize: 5,
       arrowsize: 30,
       varrowtopimg: "../../../images/arrowvt.png",
       varrowbottomimg: "../../../images/arrowvb.png",
       harrowleftimg: "../../../images/arrowhl.png",
       harrowrightimg: "../../../images/arrowhr.png",
       headerrowcount: 1,
       onScrollVertical: function (delta) {
       // store the scroll offset outside of this function in a hidden field and restore if you want to maintain vertical scroll position
       },
      onScrollHorizontal: function (delta) {
        //store the scroll offset outside of this function in a hidden field and restore if you want to maintain horizontal scroll position
      }
    });
  }

And the screen print on how the frozen grid header looks in my application

这篇关于Asp.net锁定/冻结多行Gridview标题的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！

查看全文
相关文章
C#/.NET最新文章
热门教程
热门工具
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆