grid.js

java script web控件 包含了树 列表 表单的操作

/*
SigmaRow 的说明：
	方法：
	setSelected(boolean)	设置该行的状态为"选中"
	getSequence()			取得该行的序号
	getNextRow()			获得下一个行对象
	属性：
	value		该行包含的值对象
	cells		该行所有的单元


SigmaCell 的说明：
	方法：
	setValue(value)			设置该单元的值
	getValue()				获取该单元的值


	属性：
	grid		对所在表格的引用
	row			对所在行的引用
	column		对所在列的引用
	element		对所拥有的dom对象(tcd)的引用

SigmaGrid 的说明：
	方法：
	setMenus([])	设置表格的弹出菜单，参数是一个菜单描述的数组，格式如下：
						[
						{cmd:"oThis.addNewRow()",name:"新建"},
						{cmd:"oThis.deleteSelectedRows()",name:"删除选中行"}
						]
	bindHeader([])	设置表格的列信息，参数是一个列描述的数组，格式如下：
						[
						{name:"user.name",caption:"姓名",locked:"true",mode:"string",width:60,editable:true},
						{name:"user.sex",caption:"性别",locked:"false",width:60,mode:"string"},
						{name:"cols2",caption:"日期",locked:"false",width:100,mode:"date"},
						{name:"cols4",caption:"月薪",locked:"false",mode:"money",width:100,listener:"valueChanged"},
						{name:"title",caption:"岗位",locked:"false",mode:"select",width:100,
							options:[
							{id:1,name:"程序员"},
							{id:2,name:"部门经理"},
							{id:3,name:"技术总监"}],
							listener:"titleChanged"},
						{name:"org",caption:"部门",locked:"false",mode:"function",width:100,cmd:"editCell"}
						]
	
	getElement()			获得表格的dom对象;
	setHeight(h)			设置表格的高度
	setWidth(w)				设置表格的宽度
	setContext({})			设置表格的其他定义，比如是否自动添加序号列，checkbox列；格式如下：
								{
								sequence:true,checkBox:true,readonly:true
								}
	getSelectedRows()		获得表格所有选中行对象
	getValue()				获得表格数据模型
	deleteRow(i)			删除行对象
	deleteSelectedRows()	删除所有当前选中行
	clearData()				清除表格中所有数据，定义信息(列信息、菜单信息、context信息)除外
	getColumnValueOfSelectedRows(columnName)	获得所有选中行的某列的值
	addNewRow()				新增一空行
	bindData([])				绑定数据

	属性：
		
	
*/


function rowRadioClicked(id){
	var row = getFromContainer(id);
	var rows = row.grid.getSelectedRows();
	for(var i=0;i<rows.length;i++){
		rows[i].setSelected(false);
	}
	row.setSelected(true);
}


/**
 * 生成合计行
 */
function SumRow(grid){
	if(grid.context.sum==null ||grid.context.sum.length==0)
		return;
	SigmaObject.call(this);
	grid.sumRow = this;
	var oThis = this;
	this.cells = [];
	var lockedRow = grid.getLockedTable().insertRow();
	var unLockedRow = grid.getUnLockedTable().insertRow();
	var rowHeader = null;
	var colNum = 0 ;
	this.value = new Object();
	this.grid = grid;
	if(grid.context.checkBox){
		colNum++;
		
	}else if(grid.context.radioBox){
		colNum++;
	}

	if(grid.context.sequence){
		colNum++;
	}
	if(colNum>=1){
		rowHeader = document.createElement("<td colspan='"+colNum+"'></td>")
		lockedRow.appendChild(rowHeader);
		lockedRow.align = "center";
		rowHeader.innerText = "合计";
		rowHeader.className = "lastRow";
	}
	

	var lockedColumns = grid.getLockedColumns();
	var unLockedColumns = grid.getUnLockedColumns();

	for(var i=0;i<lockedColumns.length;i++){
		var column = lockedColumns[i];
		var td = lockedRow.insertCell();
		td.style.width = grid.getColumnWidth(column);
		td.className = "lastRow";
		td.innerText = " ";
		this.cells[column.name] = td;
	}

	for(var i=0;i<unLockedColumns.length;i++){
		var column = unLockedColumns[i];
		var td = unLockedRow.insertCell();
		td.style.width = grid.getColumnWidth(column);
		td.className = "lastRow";
		td.innerText = " ";
		this.cells[column.name] = td;
	}
	
	this.refresh = function(){
		if(grid.context.sum==null ||grid.context.sum.length==0)
			return;
		var rows = oThis.grid.getRows();
		var sumColNames = [];
		var sumValues = new Object();
		var columns = [];
		for(var i=0;i<grid.context.sum.length;i++){
			sumColNames[i] = grid.context.sum[i].colName;
			sumValues[sumColNames[i]] = 0;
		}

		for(var i=0;i<rows.length;i++){
			var row = rows[i];
			var cells = row.cells;
			for(key in sumValues){
				var cell = cells[key];
				if(i==0){
					columns[key] = cell.column;
				}
				sumValues[key] = sumValues[key] + cell.getValue();
			}
		}
		if(rows.length>0){
			for(key in sumValues){
				var cell = oThis.cells[key];
				setSumCellValue(cell,columns[key],sumValues[key]);
			}
		}
	}
}

function setSumCellValue(td,column,data){
	var mode = column.mode;
	if(mode=="number"){
		td.align = "right";
		td.innerText = data;
	}else if(mode=="money"){
		td.align = "right";
		var s = ""+data;
		td.innerText = formatToMoney(s);
	}
}

function SigmaRow(grid,_index){
	SigmaObject.call(this);
	var data = grid.getValue()[_index];

	var lockedColumns = grid.getLockedColumns();
	var unLockedColumns = grid.getUnLockedColumns();
	var cells = [];
	var autoCreatedCell = [];
	var index = _index;
	this.index = _index;
	
	var lockedRow = grid.getLockedTable().insertRow(index);
	var unLockedRow = grid.getUnLockedTable().insertRow(index);
	var start = 0;
	this.value = data;
	this.autoCreatedCell = autoCreatedCell;
	this.cells = cells;
	this.grid = grid;
	var oThis = this;

	this.getSequence = function(){
		return (oThis.index+1);
	}

	this.setSequence = function(i){
		var cell = autoCreatedCell["auto_sequence"];
		if(cell!=null)
			cell.innerText = i;
		oThis.index = i-1;
	}

	this.getNextCell = function(column){
		var columns = grid.getColumnsInfo();		
		var index = columns.indexOf(column);
		if(index+1==columns.length)
			return null;
		else{
			var nextColumn = columns[index+1];
			var cell =  cells[nextColumn.name];
			return cell;
		}
	}
	this.getNextRow = function(){
		var index = grid.getValue().indexOf(oThis.value);
		if(index+1<grid.getValue().length)
			return grid.getRow(index+1);
		else{
			return grid.addNewRow();
		}
	}


	this.getValueOf = function(pName){
		var name = pName;
		var ns = name.split(".");
		if(ns[1]=="")
			ns.removeAt(1);

		var obj = oThis.value;
		if(obj == null){
			obj = new Object();
			oThis.value = obj;
		}
		if(ns.length>1){
			for(var i=0;i<ns.length-1;i++){
				var parent = obj;
				obj = parent[ns[i]];
				if(obj==null){
					obj = new Object();
					parent[ns[i]] = obj;
				}
			}
			obj = obj[ns[ns.length-1]];
		}else{
			obj = obj[pName];
		}
		
		var column = oThis.grid.getColumnByName(pName);
		
		if(column!=null){
			if(obj==null && column["defaultValue"] !=null){
				obj = column["defaultValue"];
			}
		}
		return obj;
	}


	this.getFirstCell = function(){
		var cols = grid.getOrderedColumns();
		var column = cols[0];
		return cells[column.name];
	}

	this.setValueOf = function(pName,pValue){
		
		var name = pName;
		var ns = name.split(".");
		if(ns[1]=="")
			ns.removeAt(1);
		var obj = oThis.value;
		if(obj == null){
			obj = new Object();
			oThis.value = obj;
		}
		
		if(ns.length>1){
			for(var i=0;i<ns.length-1;i++){
				var parent = obj;
				obj = parent[ns[i]];
				if(obj==null){
					obj = new Object();
					parent[ns[i]] = obj;
				}
			}
			obj[ns[ns.length-1]] = pValue;
		}else{
			obj[ns[0]] = pValue;
		}
		
	}
	
	if(grid.context.checkBox){
		var cell = lockedRow.insertCell(start);
		var checkbox = document.createElement("input");
		checkbox.type = "checkbox";
		checkbox.onclick = function(){
			oThis.setSelected(checkbox.checked);
		}
		cell.appendChild(checkbox);
		cell.align="center";
		cell.style.width=40;
		if(index +1 == grid.getValue().length &&(grid.context.sum==null||grid.context.sum.length ==0))
			cell.className = "lastRow";
		autoCreatedCell["auto_checkbox"] = cell;
		start++;
	}else if(grid.context.radioBox){
		var cell = lockedRow.insertCell(start);
		var s = '<input type=radio name=grid_auto_radio onclick="rowRadioClicked('+oThis.getId()+')"/>';
		cell.innerHTML = s;
		cell.align="center";
		cell.style.width=40;
		if(index +1 == grid.getValue().length &&(grid.context.sum==null||grid.context.sum.length ==0))
			cell.className = "lastRow";
		autoCreatedCell["auto_checkbox"] = cell;
		start++;

	}

	if(grid.context.sequence){
		var cell = lockedRow.insertCell(start);
		cell.innerText = (_index + 1);
		cell.align="center";
		cell.style.width=40;
		
		if(index +1 == grid.getValue().length &&(grid.context.sum==null||grid.context.sum.length ==0))
			cell.className = "lastRow";
		autoCreatedCell["auto_sequence"] = cell;
		start++;
	}

	for(var i=0;i<lockedColumns.length;i++){
		var column = lockedColumns[i];
		var td = lockedRow.insertCell(start);
		var cell = new SigmaCell(td,this,column);
		td.style.width = grid.getColumnWidth(column);
		
		if(index +1 == grid.getValue().length &&(grid.context.sum==null||grid.context.sum.length ==0))
			td.className = "lastRow";
		cells[column.name] = cell;
		start ++;
	}

	for(var i=0;i<unLockedColumns.length;i++){
		var column = unLockedColumns[i];
		var td = unLockedRow.insertCell(i);
		
		var cell = new SigmaCell(td,this,column);
		td.style.width = grid.getColumnWidth(column);
		
		if(index +1 == grid.getValue().length &&(grid.context.sum==null||grid.context.sum.length ==0))
			td.className = "lastRow";
		cells[column.name] = cell;
	}
	
	this.setSelected = function(s){
		if(s==true){
			lockedRow.className = "selected";
			unLockedRow.className = "selected";
		}else{
			lockedRow.className = "";
			unLockedRow.className = "";
		}
		if(s==true){
			grid.getSelectedRows()[grid.getSelectedRows().length] = oThis;
		}else{
			grid.getSelectedRows().remove(oThis);
		}
		grid.onSelect();
	}
}

function setCellFocus(id){
	var td = document.getElementById(id);
	td.focus();
}

function SigmaCell(td,row,column){
	SigmaObject.call(this);
	this.grid = row.grid;
	var grid = row.grid;
	this.column = column;
	var element = td;
	var oThis = this;
	this.state = "display";
	this.element = element;
	this.input = null;
	this.row = row;
	element.id = this.getId();
	element.ondblclick = function(){
		if(column.listener !=null){
			var event = new Object();
			event.type = "onDblClicked";
			event.cell = oThis;
			eval(column.listener + "(event)");
		   /*if(column.cmd!=null){
				eval(column.cmd+"(event)");
			}else{
				alert("你没有为这个监听器指定响应函数！column name = " + column.name+"; listener = " + column.listener);
			}*/
		}
	}


	element.onfocus = function(){
		if(grid.getContext()==null || grid.getContext().readonly==true)
			return ;
		var c = oThis.column;
		if(c.readonly==true || c.readonly=="true"){
			return ;
		}
		grid.getElement().all("dataArea").scrollLeft=0;
		if(oThis.state=="display"){
			oThis.state = "edit";
			if(column.locked=="false"){
				var unLockedArea = grid.getElement().all("unLockedArea");
				var unLockedHeader = grid.getElement().all("unLockedHeader");
				var HScroller = grid.getElement().all("HScroller");

				var unLockedColumnDisplayWidth = grid.calcUnLockedColumnDisplayWidth();
				var right = element.offsetLeft - unLockedArea.scrollLeft + grid.getColumnWidth(oThis.column);
				if(right>unLockedColumnDisplayWidth){
					var offset = right - unLockedColumnDisplayWidth + unLockedArea.scrollLeft ;
					unLockedArea.scrollLeft = offset;
					unLockedHeader.scrollLeft = offset;
					HScroller.scrollLeft = offset;
				}else{
					var left = element.offsetLeft - unLockedArea.scrollLeft;
					if(left<0){
						var offset = left + unLockedArea.scrollLeft;
						unLockedArea.scrollLeft = offset;
						unLockedHeader.scrollLeft = offset;
						HScroller.scrollLeft = offset;
					}
					
				}
			}
			oThis.paintCellEditor();
		}
	}

	
	this.setValue = function(v,fireEvent){
		var oldValue = oThis.getValue();
		if(column.mode == "string" || column.mode == "function" || column.mode=="date"||column.mode == "select"){
			;
		}else if(column.mode == "number" || column.mode == "money"){
			if(v==null||v==""){
				v =0;
			}else{