DHTMLX grid

var mygrid=new dhtmlXGridObject('gridbox');

常用方法：

1.mygrid.addRow(new_id, text, ind) -- 添加一行，参数（新行ID，以逗号分隔的cell值字符串，插入到的行序号）

2.mygrid.cells(row_id, col) -- 通过行ID，列下标 确定cell对象

mygrid.cells2(rowIndex,col) -- 通过行、列下标 确定cell对象

mygrid.getRowIndex(rowId)；-- 行ID转换成行下标

3.mygrid.deleteRow(row_id);-- 通过行ID 删除一行

4.mygrid. onSelect(rowId);-- 通过行ID选中一行

5.mygrid.getAllItemIds();-- 取所有记录ID

6.mygrid.serialize(); -- 序列化 成XML格式

7.mygrid.setEditable(false); -- 设置不可编辑

8.mygrid.editCell(stage, rowId, cellInd, newValue, oldValue); -- 编辑cell触发的事件，stage的值有0，1，2，分别代表编辑前、编辑中、编辑后，该方法必须返回一个boolean值

9.mygrid.getRowsNum(); -- 表格的行数----------mygrid.obj.rows.length

mygrid.getColumnsNum(); -- 表格的列数----- mygrid.rowsCol.length

10.mygrid.setColumnExcellType(colIndex,"类型");----- 修改列类型

mygrid.setCellExcellType(rowId,cellIndex,type)；--- 修改一格类型

　mygrid. setRowExcellType(rowId,type); ----------------修改一行类型

11.mygrid.isColumnHidden(cellInx) ;-----------判断列是否为隐藏列

mygrid.setColumnHidden(cellIndex,state); state=true/false; ---- 设置列隐藏

12.mygrid.mygrid.setCellTextStyle(rowId, cellInd, style); -- 设置cell的样式



13.键盘事件 dhtmlxgrid.js 中的 注释部分阻止键盘事件 onKeyPress(code, ctrlKey, shiftKey) 触发。

this.doKey = function (ev) {
if (!ev) {
return true;
}
if ((ev.target || ev.srcElement).value !== window.undefined) {
var zx = (ev.target || ev.srcElement);
if ((!zx.parentNode) || (zx.parentNode.className.indexOf("editable") == -1)) {
return true;
}
}
if ((globalActiveDHTMLGridObject) && (this != globalActiveDHTMLGridObject)) {
return globalActiveDHTMLGridObject.doKey(ev);
}
if (this.isActive == false) {
//document.body.onkeydown = "";
return true;
}
if (this._htkebl) {
return true;
}
if (!this.callEvent("onKeyPress", [ev.keyCode, ev.ctrlKey, ev.shiftKey, ev])) {
return false;
}
//影响键盘事件的触发
// var code = "k" + ev.keyCode + "_" + (ev.ctrlKey ? 1 : 0) + "_" + (ev.shiftKey ? 1 : 0);
// if (this.cell) { //if selection exists in grid only
// if (this._key_events[code]) {
// if (false === this._key_events[code].call(this)) {
// return true;
// }
// if (ev.preventDefault) {
// ev.preventDefault();
// }
// ev.cancelBubble = true;
// return false;
// }
// if (this._key_events["k_other"]) {
// this._key_events.k_other.call(this, ev);
// }
// }
return true;
};

在js中写入：

//添加对上下左右键、回车键的支持
function onKeyPress(code, ctrlKey, shiftKey) {
//modify action of enter key
//修改回车键事件，使得敲回车后选择状态或焦点下移
if (code == 13 && !ctrlKey && !shiftKey) {
this.editStop();
var rowInd = this.row.rowIndex;
if (rowInd != this.rowsCol.length && rowInd != this.obj.rows.length - 1) {
this.selectCell(rowInd, this.cell._cellIndex, true);
this.editCell();
}
}
//daoger_end
//根据上一个单元格的编辑状态判断通过方向键移动后下一个单元格的状态是处于选择还是编辑状态
if (code == 40 || code == 38) {
this.editStop();
var rowInd = this.row.rowIndex;
if (code == 38 && rowInd != 1) {
this.selectCell(rowInd - 2, this.cell._cellIndex, true);
this.editCell();
}
if (code == 40 && rowInd != this.rowsCol.length && rowInd != this.obj.rows.length - 1) {
this.selectCell(rowInd, this.cell._cellIndex, true);
this.editCell();
}
}
//添加左右方向键事件
if (code == 37 || code == 39) {
this.editStop();
var rowInd = this.row.rowIndex;
var cellInx=mygrid.cell._cellIndex;
if (code == 37) {
for(;cellInx > 0;){
if(!mygrid.isColumnHidden(--cellInx)){
break;
}
}
}
if (code == 39) {
var cols = mygrid.getColumnsNum();
for(;cellInx < cols;){
if(!mygrid.isColumnHidden(++cellInx)){
break;
}
}
}
this.selectCell(rowInd-1,cellInx,true);
this.editCell();
}
return true;
}
即可支持上下左右键。