parent
7aa4acc719
commit
9de8e34b9e
|
@ -111,7 +111,7 @@ table.grid .collapser-expanded
|
|||
/* cell editor */
|
||||
table.grid .celleditor
|
||||
{
|
||||
padding: 0;
|
||||
padding: 0 !important;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
|
|
83
treegrid.js
83
treegrid.js
|
@ -2,7 +2,7 @@
|
|||
* Very simple and fast tree grid/table, with support for fixed header and column, compatible with dynamic loading
|
||||
*
|
||||
* License: MPL 2.0+, (c) Vitaliy Filippov 2016+
|
||||
* Version: 2017-01-24
|
||||
* Version: 2017-04-24
|
||||
*/
|
||||
|
||||
/**
|
||||
|
@ -284,6 +284,7 @@ TreeGrid.prototype.setStickyColumnWidth = function(w)
|
|||
return;
|
||||
w = this.fixedColWrapper2.offsetWidth;
|
||||
this.fixedColWrapper.style.width = (w+this.fixedColWrapper.offsetWidth-this.fixedColWrapper.clientWidth)+'px';
|
||||
this.fixedCol.style.width = this.fixedColWrapper.clientWidth+'px';
|
||||
this.tableWrapper.style.paddingLeft = (w-this.stickyBorderWidth)+'px';
|
||||
this.fixedRowWrapper.style.paddingLeft = (w-this.stickyBorderWidth)+'px';
|
||||
this.fixedCell.style.width = w+'px';
|
||||
|
@ -294,14 +295,14 @@ TreeGrid.prototype.syncStickyHeaders = function(sync_all)
|
|||
if (!this.stickyHeaders || !this.wrapper.offsetParent)
|
||||
return;
|
||||
if (this.fixedCol.offsetWidth)
|
||||
this.setStickyColumnWidth(this.fixedCol.offsetWidth+'px');
|
||||
this.setStickyColumnWidth(this.fixedCol.getBoundingClientRect().width+'px');
|
||||
var h1, h2, h = [];
|
||||
if (sync_all)
|
||||
{
|
||||
for (var i = 0; i < this.table.rows.length-1; i++)
|
||||
{
|
||||
h1 = this.table.rows[i+1].offsetHeight;
|
||||
h2 = this.fixedCol.rows[i].offsetHeight;
|
||||
h1 = this.table.rows[i+1].getBoundingClientRect().height;
|
||||
h2 = this.fixedCol.rows[i].getBoundingClientRect().height;
|
||||
if (h1 && h2)
|
||||
h[i] = h1 < h2 ? h2 : h1;
|
||||
}
|
||||
|
@ -320,8 +321,8 @@ TreeGrid.prototype.syncStickyHeaders = function(sync_all)
|
|||
{
|
||||
for (var k = 0; k < this.toSync[i].tr.length; k++)
|
||||
{
|
||||
h1 = this.toSync[i].tr[k].offsetHeight;
|
||||
h2 = this.toSync[i].col_tr[k].offsetHeight;
|
||||
h1 = this.toSync[i].tr[k].getBoundingClientRect().height;
|
||||
h2 = this.toSync[i].col_tr[k].getBoundingClientRect().height;
|
||||
h.push(h1 && h2 && (h1 < h2 ? h2 : h1));
|
||||
}
|
||||
}
|
||||
|
@ -340,16 +341,16 @@ TreeGrid.prototype.syncStickyHeaders = function(sync_all)
|
|||
this.toSync = [];
|
||||
var trh = this.fixedRow.rows[0], w = [];
|
||||
for (var i = 0; i < trh.cells.length; i++)
|
||||
w[i] = this.sizeRow.cells[i] && this.sizeRow.cells[i].offsetWidth || 0;
|
||||
this.fixedRow.style.width = this.table.offsetWidth+'px';
|
||||
w[i] = this.sizeRow.cells[i] && this.sizeRow.cells[i].getBoundingClientRect().width || 0;
|
||||
this.fixedRow.style.width = this.table.getBoundingClientRect().width+'px';
|
||||
for (var i = 0; i < trh.cells.length; i++)
|
||||
trh.cells[i].style.width = w[i]+'px';
|
||||
this.tableWrapper.style.paddingTop = (this.fixedRow.offsetHeight-this.sizeRow.offsetHeight)+'px';
|
||||
this.fixedColWrapper2.style.bottom = (this.tableWrapper.offsetHeight-this.tableWrapper.clientHeight)+'px';
|
||||
this.fixedRowWrapper.style.right = (this.tableWrapper.offsetWidth-this.tableWrapper.clientWidth)+'px';
|
||||
this.fixedColWrapper.style.paddingTop = this.fixedRow.offsetHeight+'px';
|
||||
this.fixedColWrapper.style.paddingTop = this.fixedRow.getBoundingClientRect().height+'px';
|
||||
if (this.fixedCell.rows[0].cells[0])
|
||||
this.fixedCell.rows[0].cells[0].style.height = (this.fixedRow.offsetHeight)+'px';
|
||||
this.fixedCell.rows[0].cells[0].style.height = (this.fixedRow.getBoundingClientRect().height)+'px';
|
||||
}
|
||||
|
||||
TreeGrid.prototype.setHeader = function(newHeader)
|
||||
|
@ -458,28 +459,7 @@ TreeGrid.prototype.initCellEditing = function()
|
|||
self.onStartCellEdit(td.parentNode._node, self._getSubrow(td), self._getCellIndex(td, true), td) || {};
|
||||
if (params.abort)
|
||||
return;
|
||||
self.editedCells.push(td);
|
||||
if (params.value === undefined)
|
||||
params.value = td.innerHTML;
|
||||
td._origWidth = td.style.width;
|
||||
td._origMinWidth = td.style.minWidth;
|
||||
td.style.width = td.style.minWidth = td.offsetWidth+'px';
|
||||
td.className += ' celleditor';
|
||||
if ('ActiveXObject' in window)
|
||||
{
|
||||
td.innerHTML = '<div><input type="text" value="'+htmlspecialchars(params.value)+'" /></div>';
|
||||
td.style.height = 'inherit';
|
||||
td.parentNode.style.height = '1px';
|
||||
}
|
||||
else
|
||||
td.innerHTML = '<input type="text" value="'+htmlspecialchars(params.value)+'" />';
|
||||
var inp = td.getElementsByTagName('input')[0];
|
||||
addListener(inp, 'keydown', function(evt)
|
||||
{
|
||||
if (evt.keyCode == 13 || evt.keyCode == 10)
|
||||
self.stopCellEditing(td);
|
||||
});
|
||||
inp.focus();
|
||||
self.startCellEditing(td, params);
|
||||
}
|
||||
});
|
||||
addListener(document.body, 'click', function(evt)
|
||||
|
@ -497,6 +477,34 @@ TreeGrid.prototype.initCellEditing = function()
|
|||
});
|
||||
}
|
||||
|
||||
TreeGrid.prototype.startCellEditing = function(td, params)
|
||||
{
|
||||
var self = this;
|
||||
self.editedCells.push(td);
|
||||
if (params.value === undefined)
|
||||
params.value = td.innerHTML;
|
||||
td._origWidth = td.style.width;
|
||||
td._origMinWidth = td.style.minWidth;
|
||||
td.style.width = td.style.minWidth = td.getBoundingClientRect().width+'px';
|
||||
td.className += ' celleditor';
|
||||
if ('ActiveXObject' in window)
|
||||
{
|
||||
td.innerHTML = '<div><input type="text" value="'+htmlspecialchars(params.value)+'" /></div>';
|
||||
td.style.minHeight = td.offsetHeight+'px';
|
||||
td.style.height = 'inherit';
|
||||
td.parentNode.style.height = '1px';
|
||||
}
|
||||
else
|
||||
td.innerHTML = '<input type="text" value="'+htmlspecialchars(params.value)+'" />';
|
||||
var inp = td.getElementsByTagName('input')[0];
|
||||
addListener(inp, 'keydown', function(evt)
|
||||
{
|
||||
if (evt.keyCode == 13 || evt.keyCode == 10)
|
||||
self.stopCellEditing(td);
|
||||
});
|
||||
inp.focus();
|
||||
}
|
||||
|
||||
TreeGrid.prototype.stopCellEditing = function(td, _int)
|
||||
{
|
||||
var i = this._getCellIndex(td, true);
|
||||
|
@ -540,7 +548,7 @@ TreeGrid.prototype.initCellSelection = function(useMultiple)
|
|||
|
||||
self.deselectAll = function(cell)
|
||||
{
|
||||
var els = self.table.querySelectorAll('td.selected');
|
||||
var els = (self.wrapper||self.table).querySelectorAll('td.selected');
|
||||
var deselected = [];
|
||||
if (self.onDeselectAllCells)
|
||||
self.onDeselectAllCells();
|
||||
|
@ -556,7 +564,7 @@ TreeGrid.prototype.initCellSelection = function(useMultiple)
|
|||
|
||||
function initSingleCellSelection(self)
|
||||
{
|
||||
addListener(self.table, 'mousedown', function(evt)
|
||||
addListener(self.wrapper||self.table, 'mousedown', function(evt)
|
||||
{
|
||||
self.deselectAll();
|
||||
if (evt.which != 1)
|
||||
|
@ -758,7 +766,7 @@ TreeGridNode.prototype._renderCell = function(rowIndex, colIndex, cell, force)
|
|||
tr.appendChild(document.createElement('td'));
|
||||
// virtualDOM-like approach: compare old HTML properties
|
||||
if (force || !this._oldCells[rowIndex] || !this._oldCells[rowIndex][colIndex] ||
|
||||
cell && !this._hashEqual(this._oldCells[rowIndex][colIndex], cell))
|
||||
!this._hashEqual(this._oldCells[rowIndex][colIndex], cell||{}))
|
||||
{
|
||||
var old;
|
||||
if (colIndex == 0 && rowIndex == 0)
|
||||
|
@ -849,7 +857,7 @@ TreeGridNode.prototype._toggleHandler = function()
|
|||
this.toggle();
|
||||
}
|
||||
|
||||
TreeGridNode.prototype.toggle = function()
|
||||
TreeGridNode.prototype.toggle = function(skipHeaders)
|
||||
{
|
||||
if (this.leaf)
|
||||
return;
|
||||
|
@ -896,7 +904,8 @@ TreeGridNode.prototype.toggle = function()
|
|||
st = st.concat(e.children);
|
||||
}
|
||||
}
|
||||
this.grid.syncStickyHeaders();
|
||||
if (!skipHeaders)
|
||||
this.grid.syncStickyHeaders();
|
||||
}
|
||||
|
||||
TreeGridNode.prototype.setChildren = function(isLeaf, newChildren)
|
||||
|
|
Loading…
Reference in New Issue