<style type="text/css">
.Freezing
{
position:relative
table-layout:fixed
top:expression(this.offsetParent.scrollTop)
z-index: 10
}
.Freezing th{text-overflow:ellipsisoverflow:hiddenwhite-space: nowrappadding:2px}
</style>
2.Javascript方法
//创建表头
if(document.getElementById("gvTitle") == null)
{
var gdvList = document.getElementById("gvCommon")
var gdvHeader = gdvList.cloneNode(true)
for(i = gdvHeader.rows.length - 1i >0i--)
{
gdvHeader.deleteRow(i)
}
document.getElementById("divTitle").appendChild(gdvHeader)
gdvList.deleteRow(0)
//gdvList.rows[0].style.display = 'none'
}
大致做法是利用JS方法Copy出一个表头 gdvHeader 放在一个“divTitle”的DIV中。
GridView是包含在“divGvData”DIV中的,然后设置divTitle的页面位置和divGvData的一致,也就是覆盖在上面。目前发现效果还行。有一点要注意,gdvHeader.id = "gvTitle"要重新设置一个ID,不然删除的还是GridView的数据行。
3.HTML中的部分代码:
<div id="divTitle" style="position:relativetop:0left:0overflow:hiddenwidth:978pxborder:0px solid red"></div>
<div id="divGvData" runat="server" style="position:relativetop:0pxleft:0pxoverflow:scrollwidth:994pxheight:450px" onscroll="funGrilViewScroll()return false">
<asp:GridView ID="gvCommon" style="position:relativetop:0pxleft:0px" runat="server" CssClass="gvFixd" BackColor="White" BorderColor="#999999" BorderStyle="None" BorderWidth="1px" CellPadding="3" AutoGenerateColumns="False" GridLines="Vertical" PageSize="5" AllowSorting="True" OnSorting="gvCommon_Sorting" >
<FooterStyle BackColor="#CCCCCC" ForeColor="Black" />
<RowStyle BackColor="#E7E7FF" ForeColor="Black" Font-Size="Small" />
<HeaderStyle HorizontalAlign="Center" BackColor="#000084" BorderColor="White" BorderWidth="1px" BorderStyle="Solid" Font-Bold="True" ForeColor="White"/>
</asp:GridView>
</div>
4.asp.net方法
protected void InitGridviewHeader(GridView _gv1, Table _tb1, Panel _pc1)
{
//Page.EnableViewState = false
//[Espal]Copiando las propiedades del renglon de encabezado
//[English]Coping a header row data and properties
_tb1.Rows.Add(_gv1.HeaderRow)
_tb1.Rows[0].ControlStyle.CopyFrom(_gv1.HeaderStyle)
_tb1.CellPadding = _gv1.CellPadding
_tb1.CellSpacing = _gv1.CellSpacing
_tb1.BorderWidth = _gv1.BorderWidth
//if (!_gv1.Width.IsEmpty)
//_gv1.Width = Unit.Pixel(Convert.ToInt32(_gv1.Width.Value) + Convert.ToInt32(_tb1.Width.Value) + 13)
//[Espa]Copiando las propiedades de cada celda del nuevo encabezado.
//[English]Coping each cells properties to the new header cells properties
int Count = 0
_pc1.Width = Unit.Pixel(100)
for (Count = 0Count <_gv1.HeaderRow.Cells.Count - 1Count++)
{
_tb1.Rows[0].Cells[Count].Width = _gv1.Columns[Count].ItemStyle.Width
_tb1.Rows[0].Cells[Count].BorderWidth = _gv1.Columns[Count].HeaderStyle.BorderWidth
_tb1.Rows[0].Cells[Count].BorderStyle = _gv1.Columns[Count].HeaderStyle.BorderStyle
_pc1.Width = Unit.Pixel(Convert.ToInt32(_tb1.Rows[0].Cells[Count].Width.Value) + Convert.ToInt32(_pc1.Width.Value) + 14)
}
//Panel1.Width = Unit.Pixel(Convert.ToInt32(_tb1.Rows[0].Cells[Count-1].Width.Value) + 12)
}
默认情况下,C1FlexGrid仅有一行多表头,如何来动态的给它添加多表头?1.添加行和列:通过FlexGrid.Columns.Add和FlexGrid.Rows.Add方法添加行和列。
2.添加多行表头:通过FlexGrid.ColumnHeaders.Rows.Add方法,在ColumnHeaders区域添加多行的表头,实现多行表头。
3.设置Caption内容:通过FlexGrid.ColumnHeaders[row, column]设置Caption内容。
4.合并:通过使用AllowMerging属性对表头进行合并。
详细的代码实现,请参考下面的博客
http://blog.gcpowertools.com.cn/post/2016/02/03/FlexGrid_MultiRowsColumnHeader.aspx
1.首先要把DevExpress的GridControl转换为BandedGridView2.设置显示列及绑定的字段
此处设置与我们平常使用GridControl制件一样
3.进入设计视图(见下图),点击Bands,
3.1 添加多个Band,如图中1处按键添加
3.2 布局:拖动相应Band进行布局,根据需要调整Band的位置,
4.3 数据绑定:
【点击Show Columns selector 显示之前我们设置好的列】 选取相应列到指定的Band下面,如图2中区域
欢迎分享,转载请注明来源:内存溢出
评论列表(0条)