支持3.X
使用方法
var grid = Ext.grid.GridPanel({
view : new Ext.ux.grid.ColumnLockBufferView({}),
cm : new Ext.ux.grid.LockingColumnModel({
columns : [new Ext.grid.RowNumberer(),.....]
})
......
});
Ext.ns('Ext.ux.grid');
/**
* 合并BufferView与LockingGridView
*
* @class Ext.ux.grid.ColumnLockBufferView
* @extends Ext.ux.grid.BufferView
* @author yaoba
*/
Ext.ux.grid.ColumnLockBufferView = Ext.extend(Ext.ux.grid.BufferView, {});
Ext.apply(Ext.ux.grid.BufferView.prototype,
Ext.ux.grid.LockingGridView.prototype);
Ext.apply(Ext.ux.grid.ColumnLockBufferView.prototype, {
lockText : "锁列",
unlockText : "解锁列",
initTemplates : function() {
var ts = this.templates || {};
if (!ts.master) {
ts.master = new Ext.Template(
'<div class="x-grid3" hidefocus="true">',
'<div class="x-grid3-locked">',
'<div class="x-grid3-header"><div class="x-grid3-header-inner"><div class="x-grid3-header-offset" style="{lstyle}">{lockedHeader}</div></div><div class="x-clear"></div></div>',
'<div class="x-grid3-scroller"><div class="x-grid3-body" style="{lstyle}">{lockedBody}</div><div class="x-grid3-scroll-spacer"></div></div>',
'</div>',
'<div class="x-grid3-viewport x-grid3-unlocked">',
'<div class="x-grid3-header"><div class="x-grid3-header-inner"><div class="x-grid3-header-offset" style="{ostyle}">{header}</div></div><div class="x-clear"></div></div>',
'<div class="x-grid3-scroller"><div class="x-grid3-body" style="{bstyle}">{body}</div><a href="#" class="x-grid3-focus" tabIndex="-1"></a></div>',
'</div>',
'<div class="x-grid3-resize-marker"> </div>',
'<div class="x-grid3-resize-proxy"> </div>', '</div>');
}
this.templates = ts;
Ext.ux.grid.LockingGridView.superclass.initTemplates.call(this);
// Ext.ux.grid.BufferView.superclass.initTemplates.call(this);
var ts = this.templates;
// empty div to act as a place holder for a row
ts.rowHolder = new Ext.Template('<div class="x-grid3-row {alt}" style="{tstyle}"></div>');
ts.rowHolder.disableFormats = true;
ts.rowHolder.compile();
ts.rowBody = new Ext.Template(
'<table class="x-grid3-row-table" border="0" cellspacing="0" cellpadding="0" style="{tstyle}">',
'<tbody><tr>{cells}</tr>',
(this.enableRowBody
? '<tr class="x-grid3-row-body-tr" style="{bodyStyle}"><td colspan="{cols}" class="x-grid3-body-cell" tabIndex="0" hidefocus="on"><div class="x-grid3-row-body">{body}</div></td></tr>'
: ''), '</tbody></table>');
ts.rowBody.disableFormats = true;
ts.rowBody.compile();
},
doRender : function(cs, rs, ds, startRow, colCount, stripe, onlyBody) {
var ts = this.templates, ct = ts.cell, rt = ts.row, last = colCount - 1, buf = [], lbuf = [], cb, lcb, c, p = {}, rp = {}, r;
var rb = ts.rowBody;
var rh = this.getStyleRowHeight();
var vr = this.getVisibleRows();
var tstyle = 'width:' + this.getTotalWidth() + ';height:' + rh + 'px;';
var lstyle = 'width:' + this.getLockedWidth() + ';height:' + rh + 'px;';
rp = {
tstyle : tstyle
};
for (var j = 0, len = rs.length; j < len; j++) {
r = rs[j];
cb = [];
lcb = [];
var rowIndex = (j + startRow);
var visible = rowIndex >= vr.first && rowIndex <= vr.last;
if (visible) {
for (var i = 0; i < colCount; i++) {
c = cs[i];
p.id = c.id;
p.css = (i === 0 ? 'x-grid3-cell-first ' : (i == last
? 'x-grid3-cell-last '
: ''))
+ (this.cm.config[i].cellCls ? ' '
+ this.cm.config[i].cellCls : '');
p.attr = p.cellAttr = '';
p.value = c.renderer(r.data[c.name], p, r, rowIndex, i, ds);
p.style = c.style;
if (Ext.isEmpty(p.value)) {
p.value = ' ';
}
if (this.markDirty && r.dirty
&& Ext.isDefined(r.modified[c.name])) {
p.css += ' x-grid3-dirty-cell';
}
if (c.locked) {
lcb[lcb.length] = ct.apply(p);
} else {
cb[cb.length] = ct.apply(p);
}
}
}
var alt = [];
if (stripe && ((rowIndex + 1) % 2 === 0)) {
alt[0] = 'x-grid3-row-alt';
}
if (r.dirty) {
alt[1] = ' x-grid3-dirty-row';
}
rp.cols = colCount;
if (this.getRowClass) {
alt[2] = this.getRowClass(r, rowIndex, rp, ds);
}
rp.alt = alt.join(' ');
rp.cells = cb.join('');
rp.tstyle = tstyle;
buf[buf.length] = !visible ? ts.rowHolder.apply(rp) : (onlyBody
? rb.apply(rp)
: rt.apply(rp));
// buf[buf.length] = rt.apply(rp);
rp.cells = lcb.join('');
rp.tstyle = lstyle;
lbuf[lbuf.length] = !visible ? ts.rowHolder.apply(rp) : (onlyBody
? rb.apply(rp)
: rt.apply(rp));
// lbuf[lbuf.length] = rt.apply(rp);
}
return [buf.join(''), lbuf.join('')];
},
doUpdate : function() {
if (this.getVisibleRowCount() > 0) {
var g = this.grid, cm = g.colModel, ds = g.store;
var cs = this.getColumnData();
var vr = this.getVisibleRows();
for (var i = vr.first; i <= vr.last; i++) {
// if row is NOT rendered and is visible, render it
if (!this.isRowRendered(i)) {
var html = this.doRender(cs, [ds.getAt(i)], ds, i, cm
.getColumnCount(), g.stripeRows, true);
this.getRow(i).innerHTML = html[0];
this.getLockedRow(i).innerHTML = html[1];
}
}
this.clean();
}
},
syncScroll : function(e) {
var mb = this.scroller.dom;
this.lockedScroller.dom.scrollTop = mb.scrollTop;
Ext.ux.grid.LockingGridView.superclass.syncScroll.call(this, e);
this.update();
},
layout : function() {
Ext.ux.grid.BufferView.superclass.layout.call(this);
this.update();
if (!this.mainBody) {
return;
}
var g = this.grid;
var c = g.getGridEl();
var csize = c.getSize(true);
var vw = csize.width;
if (!g.hideHeaders && (vw < 20 || csize.height < 20)) {
return;
}
this.syncHeaderHeight();
if (g.autoHeight) {
this.scroller.dom.style.overflow = 'visible';
this.lockedScroller.dom.style.overflow = 'visible';
if (Ext.isWebKit) {
this.scroller.dom.style.position = 'static';
this.lockedScroller.dom.style.position = 'static';
}
} else {
this.el.setSize(csize.width, csize.height);
var hdHeight = this.mainHd.getHeight();
var vh = csize.height - (hdHeight);
}
this.updateLockedWidth();
if (this.forceFit) {
if (this.lastViewWidth != vw) {
this.fitColumns(false, false);
this.lastViewWidth = vw;
}
} else {
this.autoExpand();
this.syncHeaderScroll();
}
this.onLayout(vw, vh);
}
});
分享到:
相关推荐
bufferview滚动时,滚动前后合并单元格修改, 要在自己的文件中,加入单元格合并方法: function _setDefaultMearge(rows) { var rows = $("#tt").datagrid('getRows'); var len = rows.length; var preIndex = 0...
CSV文件批量合并工具(批量合并多个CSV文件)是一款简洁好用,绿色小巧的CSV文件合并工具。CSV文件批量合并工具非常的使用,让你能够更轻松快捷的进行CSV文件合并工作,非常方便。可以同时批量合并多个CSV文本文件,...
jqgrid合并行、合并列 先看示例图片最终效果: jqgrid合并单元格 .jqgrid { width: 80%; margin: 0 auto; } /* 这个代码是解决表头有一点点错位的问题 */ .ui-state-default, .ui-widget-content .ui-state...
DataGridView合并单元格(纵向合并及横向合并)
Excel合并器是一款Windows系统下的Excel文件和工作表合并工具软件,它支持批量合并Excel XLS/XLSX文件格式和多种工作表格式文件(例如ODS, CSV, XML)成一个文件,或者合并多个工作表到一个工作表。最大的亮点是,...
合并tekla图纸。使用场景模型A和模型B是相同模型,但是AB模型分别出图位置不同,通过此软件可合并tekla的图纸在一个模型上。
3、工具需要电脑浏览器打开,输入最后一个数字(如 Y2hlbmppbmdjb25n427则是输入Y2hlbmppbmdjb25n后面的427),点击生成,将生成的合并工具放到需要合并的视频文件夹中,双击即可。 4、本工具合并不了加密视频。 5、...
Unity3d mesh合并,网格合并具体用法教程,助力快速理解 Unity 中合并网格的概念与流程。 Unity 开发中,如果我们需要做性能优化 或者是一些项目需求,需要将零散的几个物体进行合并,成为一个整体的模型 而由于...
el-element中el-table合并单元格 合并列。无限制列合并。通过循环数据源数据获取该列需要合并的行数。
Problem D:石子合并(包含源程序c++) Time Limit:1000MS Memory Limit:65536K Description 在一个圆形操场的四周摆放着 n 堆石子. 现要将石子有次序地合并成一堆, 规定每次只能选相邻的 2 堆石子合并成新的一堆, ...
实现同列相同单元格值的合并与统一列头的归类
pdf格式文件合并 将文件放置到目录pdf中,以pdf为后缀名 合并后生成的文件名为《合并文件.pdf》 pdf格式文件合并 将文件放置到目录pdf中,以pdf为后缀名 合并后生成的文件名为《合并文件.pdf》 pdf格式文件合并 将...
这是一个表格合并的工具(代码),可以合并office生成的、以及wps生成的表格,合并后表格还能保持原来的格式(包括字体、颜色等)。使用场景是:老师给每个学生发了一个表格样板,这个表格具有一样的表头和格式,让...
多文件的合并与分解.rar多文件的合并与分解.rar多文件的合并与分解.rar多文件的合并与分解.rar多文件的合并与分解.rar多文件的合并与分解.rar多文件的合并与分解.rar
//函数说明:合并指定表格(表格id为_w_table_id)指定列(列数为_w_table_colnum)的相同文本的相邻单元格 //参数说明:_w_table_id 为需要进行合并单元格的表格的id。如在HTMl中指定表格 id="data" ,此参数应为 #...
Labview 合并Excel多单元格 1-可合并表头,多方面合并,与手工操作一致,批量执行
Bin文件合并工具,可支持批量合并
WPF DataGrid合并行
本文档是通信中对抗多径衰落从而提高传输性能的三种合并方式的MATLAB仿真代码,三种合并方式为:选择合并、等增益合并和最大比合并。