grid.js

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

				for(var i=0;i<v.length;i++){
					var c = v.charAt(i);
					if((c<'0' || c>'9')&&c!='.'){
						alert("列" + column.name + "只允许输入数字！");
						return;
					}
				}
				try{
					v = parseFloat(v);
				}catch(e){
					v = 0;
				}
			}
		}else if(column.mode == "option" || column.mode =="check"){
			
		}
		if(v!=oldValue){
			row.setValueOf(column.name,v);
			if(grid.sumRow!=null)
				grid.sumRow.refresh();

			if(oThis.state=="display"){
				oThis.paintCell();
			}else{
				if(oThis.input!=null){
					oThis.input.value = v;
				}
			}
			if(column.listener!=null){
				if(fireEvent==null||fireEvent=="undefined" || fireEvent==false)
					return;
				var event = new Object;
				event.type = "onValueChanged";
				event.cell = oThis;
				event.oldValue = oldValue;
				event.newValue = v;
				eval(column.listener + "(event)");
				/*if(column.cmd!=null){
					eval(column.cmd+"(event)");
				}else{
					alert("你没有为这个监听器指定响应函数！column name = " + column.name+"; listener = " + column.listener);
				}*/
			}
		}
	}

	
	this.getValue = function(){
		var name = column.name;
		v = row.getValueOf(name);
		
		if(typeof(v)=="undefined"){
			v = null;
		}
		
		if(v==null){
			if(column.mode=="string"|| column.mode=="function"||column.mode=="date" || column.mode=="link"){
				v = " ";
			}else if(column.mode=="number" || column.mode=="money"){
				v = 0;
			}else if(column.mode=="check" || column.mode=="radio"){
				v = false;
			}
		}

		if(v=="" && typeof(v)!="boolean"){
			if(column.mode=="money"|| column.mode == "number"){
				v = 0;
			}else{
				v = " ";
			}
		}
		
		if(column.mode=="date" && v.length>10){
			v = v.substring(0,10);
		}
		
		row.setValueOf(name,v);
		
		return v;
	}

	this.paintCellEditor = function(){
		var mode = column.mode;
		var input = null;
		if(mode=="string"){
			element.innerHTML = "";
			input = document.createElement("input");
			input.type = "text";
			input.value = oThis.getValue();
			input.maxSize = 99;
			input.style.width = grid.getColumnWidth(column);			
		}else if(mode=="date"){
			element.innerHTML = "";
			input = document.createElement("input");
			input.type = "text";
			input.value = oThis.getValue();
			input.maxSize = 99;
			input.style.width = grid.getColumnWidth(column);
		}else if(mode=="check"){
			element.innerHTML = "";
			if(oThis.getValue()==true){
				input = document.createElement("<input type='checkbox' checked=true>");
			}else{
				input = document.createElement("<input type='checkbox'>");
			}
			
		}else if(mode=="number"){
			element.innerHTML = "";
			input = document.createElement("input");
			input.type = "text";
			input.value = oThis.getValue();
			input.maxSize = 99;
			input.style.width = grid.getColumnWidth(column);
		}else if(mode=="money"){
			element.innerHTML = "";
			input = document.createElement("input");
			input.type = "text";
			input.value = oThis.getValue();
			input.maxSize = 99;
			input.style.width = grid.getColumnWidth(column);
		}else if(mode=="select"){
			element.innerHTML = "";
			input = document.createElement("select");
			input.style.width = grid.getColumnWidth(column);
			var options = oThis.column.options;
			var op = document.createElement("option");
			op.value = null;
			op.text = "请选择";
			input.add(op);
			
			var opIndex = 0;
			for(var i=0;i<options.length;i++){
				var vop = null;
				vop = document.createElement("option");
				vop.value = options[i].id;
				vop.text = options[i].name;
				
				if(vop.value == oThis.getValue()){
					opIndex = i+1;
				}
				input.add(vop);
				input.selectedIndex = opIndex;
			}
		}else if(mode=="function"){
			var event = new Object();
			event.type = "onEdit";
			event.cell = oThis;
			eval(column.cmd+"(event)");

			element.innerHTML = "";
			input = document.createElement("input");
			input.type = "text";
			input.value = oThis.getValue();
			input.maxSize = 99;
			input.style.width = grid.getColumnWidth(column);			
		}else if(mode=="link"){
			
		}

		if(input!=null){
			this.input = input;
			input.onblur = function(){
				oThis.state = "display";
				oThis.paintCell();
			}

			input.onkeydown = function(){
				if(window.event.keyCode==13){
					if(oThis.column.mode=="check")
						oThis.setValue(this.checked,true);
					else
						oThis.setValue(this.value,true);
					oThis.state = "display";
					oThis.paintCell();
					var nextCell = row.getNextCell(oThis.column);
					if(nextCell!=null)
						setTimeout("setCellFocus("+nextCell.element.id+")",100);
					else{
						nextCell = row.getNextRow().getFirstCell();
						if(nextCell!=null)
							setTimeout("setCellFocus("+nextCell.element.id+")",100);
					}
					return ;
				}else{
					
				}
			}

			input.onchange = function(){
				if(oThis.column.mode=="check"){
					oThis.setValue(this.checked,true);
				}else if(oThis.column.mode=="select"){
					var options = this.options;
					var op;
					for(var i=0;i<options.length;i++){
						op = options[i];
						if(op.selected){
							var v = op.value;
							oThis.setValue(v,true);
							break;
						}
					}
				}else{
					oThis.setValue(this.value,true);
				}
			}
			element.appendChild(input);
			input.focus();
		}
	}

	this.paintCell = function(){
		var cell = element;
		var data = oThis.getValue();
		oThis.row.setValueOf(oThis.column.name,v);
		var mode = column.mode;
		if(mode==null || mode =="")
			mode = "string";
		cell.innerHTML = "";
		if(mode=="string"){
			cell.align = "left";
			cell.innerText = data;
		}else if(mode=="number"){
			cell.align = "right";
			cell.innerText = data;
		}else if(mode=="money"){
			cell.align = "right";
			var s = ""+data;
			cell.innerText = formatToMoney(s);
		}else if(mode=="check"){
			cell.align = "center";
			if(data==true){
				var d = document.createElement("div");
				d.className = "checked";
				d.onfocus = function(){
					oThis.element.focus();
				}
				cell.appendChild(d);
			}else{
				cell.innerText = " ";
			}			
		}else if(mode=="radio"){
			cell.align = "center";
			var s= '<input type="checkbox"';
			if(data){
				s = s + " checked>";
			}else
				s = s + '>';
			cell.innerHTML = s;
		}else if(mode=="image"){
			cell.align = "center";
		}else if(mode=="select"){
			cell.align = "center";
			if(data==null || data==""){
				cell.innerText = "请选择";
			}else{
				var op = grid.getColumnOption(column,data);
				if(op!=null)
					cell.innerText = op.name;
				else
					cell.innerText = "请选择";
			}
		}else if(mode=="function"){
			cell.align = "left";
			cell.innerText = data;
		}else if(mode=="date"){
			cell.align = "left";
			cell.innerText = data;
		}else if(mode=="link"){
			
			var a = document.createElement("a");
			a.innerText = data;
			cell.appendChild(a);
			a.href = "#";
			a.onclick = function(){
				var event = new Object();
				event.type = "onLink";
				event.cell = oThis;
				eval(column.href+"(event)");
				return false;
			}
			cell.align = "center";
		}
		if(oThis.column.align!=null && oThis.column.align!=""){
			cell.align = oThis.column.align;
		}
	}

	this.paintCell();
}


function SigmaGrid(){
	SigmaObject.call(this);
	var element = document.createElement("div");
	
	
	element.style.position ="relative";
	element.className = "SigmaGrid";
	element.style.width = "100%";
	element.style.height = "100%";
	element.style.overflow = "";
	this.element = element;
	var strs = [];
	var columns = null;
	var lockedColumns = null;
	var unLockedColumns = null;
	var oThis = this;
	var value = null;
	var headerHeight = 20;
	var hscrollerHeight = 0;
	var vscrollerWidth = 0;
	var context = null;
	var rows = [];
	var selectedRows = [];
	var menuArea = null;
	var menus = null;

	this.setBaseUrl = "";

	this.debugCanvas = null;

	this.debug = function(s){	
		if(oThis.debugCanvas!=null){
			oThis.debugCanvas.innerText = oThis.debugCanvas.innerText + "\n" + s;
		}
	}

	this.getContext = function(){
		return context;
	}

	this.setMenus = function(m){
		menus = m;
	}
	this.getMenus = function(){
		return menus;
	}

	this.getNamesOfColumn = function(column){
		var name = column.name;
		return name.split(".");
	}

	
	element.oncontextmenu = function(){
		window.event.returnValue=false;
	}

	
	element.onmousedown = function(){
		if(event.button==2 && oThis.getMenus()!=null && oThis.getMenus().length>0){
			if(menuArea==null){
				menuArea = element.all("menuArea");
				menuArea.style.width = "100";
				
				for(var i=0;i<menus.length;i++){
					var menu = menus[i];
					var menuDiv = document.createElement("div");
					menuDiv.innerText = menu.name;
					menuDiv.className = "menuItem";
					menuArea.appendChild(menuDiv);
					menuDiv.menu = menu ;
					menuDiv.onmouseover = function(){
						this.className = "menuItem2";
					}

					menuDiv.onmouseout = function(){
						this.className = "menuItem";
					}
					
					menuDiv.onmousedown= function(){
						if(event.button==1){
							eval(this.menu.cmd);
						}
					}
				}
			}
			menuArea.style.display = "";
			menuArea.style.top = event.y;
			menuArea.style.left = event.x-2;
		}else{
			if(menuArea!=null)
				menuArea.style.display = "none";
		}

	}
	element.id = oThis.getId();

	//菜单div
	strs[strs.length] = '<div id="menuArea" style="z-index:2;display:none;overflow:hidden;position:absolute;left:0;top:0;width:100;"></div>';
	//表头区布局
	strs[strs.length] = '<div id="headerArea" style="overflow:hidden;position:relative;height:20;width:1;"> ';
	strs[strs.length] = '<div id="lockedHeader" style="position:absolute;left:0;top:0;overflow:hidden;width:100;height:20;">';
	strs[strs.length] = '<table class="lockedHeader" id="lockedTabHeader" cellspacing=0 cellpadding=0 border=0 style="table-layout:fixed" ></table>';
	strs[strs.length] = '</div>';
	strs[strs.length] = '<div id="unLockedHeader" style="position:absolute;left:100;top:0;overflow:hidden;width:20;height:20;">';
	strs[strs.length] = '<table id="unLockedTabHeader" class="unLockedHeader" cellspacing=0 cellpadding=0 border=0 style="table-layout:fixed" ></table>';
	strs[strs.length] = '</div>';
	strs[strs.length] = '</div>';

	//列宽调整div
	strs[strs.length] = '<div id="colResize" style="display:none;overflow:hidden;position:absolute;left:0;top:0;width:100;"></div>';

	//数据区布局
	strs[strs.length] = '<div id="dataArea" style="z-index:1;overflow:hidden;position:relative;height:10;width:10;">';
	strs[strs.length] = '<div id="lockedArea" style="border:0;position:absolute;left:0;top:0;overflow:hidden;width:10;height:10;">';
	strs[strs.length] = '<table id="lockedTable" cellspacing=0 cellpadding=0 border=0 style="table-layout:fixed" >';
	strs[strs.length] = '</table>';
	strs[strs.length] = '</div>';
	strs[strs.length] = '<div id="unLockedArea" style="border:0;position:absolute;left:10;top:0;overflow:hidden;width:10;height:10;">';
	strs[strs.length] = '<table id="unlockedTable" cellspacing=0 cellpadding=0 border=0 style="table-layout:fixed" >';
	strs[strs.length] = '</table>';
	strs[strs.length] = '</div>';
	strs[strs.length] = '</div>';

	//合计区域
	/*
	strs[strs.length] = '<div id="sumArea" style="overflow:hidden;position:relative;height:10;width:10;">';
	strs[strs.length] = '<div id="lockedSumArea" style="border:0;position:absolute;left:0;top:0;overflow:hidden;width:10;height:10;">';
	strs[strs.length] = '<table id="lockedSumTable" cellspacing=0 cellpadding=0 border=0 style="table-layout:fixed" >';
	strs[strs.length] = '</table>';
	strs[strs.length] = '</div>';
	strs[strs.length] = '<div id="unLockedSumArea" style="border:0;position:absolute;left:10;top:0;overflow:hidden;width:10;height:10;">';
	strs[strs.length] = '<table id="unlockedSumTable" cellspacing=0 cellpadding=0 border=0 style="table-layout:fixed" >';
	strs[strs.length] = '</table>';
	strs[strs.length] = '</div>';
	strs[strs.length] = '</div>';
	*/
	
	//滚动条布局
	strs[strs.length] = '<div id="scrollers" style="z-index:-1;position:absolute;left:0;top:0;height:17;width:10;overflow:hidden;">';
	strs[strs.length] = '<div id="VScroller" style="position:absolute;left:10;top:0;height:10;width:17;" style="overflow:auto;">';
	strs[strs.length] = '<div id="virtualVArea" style="position:relative;height:10;width:10;">';
	strs[strs.length] = '</div>';
	strs[strs.length] = '</div>';
	strs[strs.length] = '<div id="HScroller" style="height:17;width:10;position:absolute;left:10;top:10;font-size:1;" style="overflow:auto;">';
	strs[strs.length] = '<div id="virtualHArea" style="position:relative;height:10;width:10;">';
	strs[strs.length] = '</div>';
	strs[strs.length] = '</div>';
	strs[strs.length] = '</div>';

	
	
	
	

	var a = strs.join("");
	element.innerHTML = a;

	var lockedTable = element.all("lockedTable");
	var unLockedTable = element.all("unlockedTable");
	var dataArea = element.all("dataArea");