当前位置 : 主页 > 网页制作 > Dojo >

dojo dataGrid 异步保存数据

来源:互联网 收集:自由互联 发布时间:2021-06-15
dojo.require("dojox.grid.EnhancedGrid");dojo.require("dojox.grid.enhanced.plugins.IndirectSelection");dojo.require("dojo.data.ItemFileWriteStore");dojo.require("dojo.parser");dojo.declare("ManuPlan",null,{dataGrid : null,store : null,// 布局
dojo.require("dojox.grid.EnhancedGrid");
dojo.require("dojox.grid.enhanced.plugins.IndirectSelection");
dojo.require("dojo.data.ItemFileWriteStore");
dojo.require("dojo.parser");

dojo.declare("ManuPlan",null,{
	dataGrid : null,
	store : null,
	// 布局
	layout:null,
	constructor :function(){
//	this.store=new dojo.data.ItemFileWriteStore(
//			{
//				url : "manuPlan!doGetManuPlanList.action?manuPlan.pageNumber=1&manuPlan.pagesize=10",
//				clearOnClose : true,
//				urlPreventCache : true
//			});
	this.layout=[ {
			defaultCell : {
				width : 8,
				editable : false,
				type : dojox.grid.cells._Widget,
				styles : 'text-align: left;'
			},
			rows : [ {
				name : "序号",
				field : "rowNumber"
				
			}, {
				name : "日期",
				field : "date",
				editable : true,
				type: dojox.grid.cells.DateTextBox,
				formatter:this.formatDate,
				constraint:{datePattern:"yyyy-MM-dd",selector: "date"}
			
			}, {
				name : "审核",
				field : "checkerId",
				formatter : this.formatCheckInfo
			}, {
				name : "指示编号(批号)",
				field : "number"
			}, {
				name : "半成品名称",
				field : "itemName"
			}, {
				name : "助记码",
				field : "itemHelpCode"
			}, {
				name : "数量",
				field : "quantity"
			}, {
				name : "单位",
				field : "UnitName"
			}, {
				name : "备注",
				field : "note"
			} ]

		} ];
	this.dataGrid=new dojox.grid.EnhancedGrid( {
		id : "dataGrid",
//		store : this.store,
		structure : this.layout,
		rowSelector : "20px",
		autoHeight : true,
		escapeHTMLInData : false,
		canSort : this.canSort,
		
//		onCellFocus:function(inCell, inRowIndex){
//			if(inCell.field=="itemName"){
////				alert(inCell);
//				console.log("inRowIndex="+inRowIndex+",inCell.index="+inCell.index);
//				dijit.byId("addDlg").show();
//			}
//		},
				
		style : "width: auto;height: 160px;",
		plugins : {
			indirectSelection : {
				headerSelector : true,
				name : "Selection",
				width : "60px",
				styles : "text-align: center;"
			}
		}
	});
	
	
	
},
// 格式化
formatCheckInfo : function(inDatum, rowIndex) {
	// var value = grid.store.getValue(grid.getItem(rowIndex), name);
	return inDatum ? "Y" : "N";
},
// 格式化日期
formatDate : function(inDatum, rowIndex) {
	if (dojo.isString(inDatum)) {
		return inDatum
	} else {
		return dojo.date.locale.format(inDatum, this.constraint);
	}
},
// 指定排序列
canSort : function(colIndex, field) {
	return false;
},
// 获取存储器
getStore:function(){
	return this.store;
},
// 修改
onSet : function(item, attribute, oldValue, newValue) {
	
	var parameter = {
		"manuPlan.Id" : this.store.getValue(item, "mpId"),
		"manuPlan.manuPlanEntry.id" : this.store.getValue(item,"mpeId"),
		"manuPlan.date" : dojo.date.locale.format(this.store.getValue(item, "date"), {datePattern:"yyyy-MM-dd",selector: "date"}),
		"manuPlan.number" : this.store.getValue(item, "number")
	};
	// 异步修改数据
	var self=this;
	dojo.xhrPost( {
		url : "manuPlan!doUpdateManuPlan.action",
		handleAs : "json",
		content : parameter,
		load : function(response) {
			if (response.id != "0") {
				self.store.save();
				self.onComplete();
			} else {
				alert(response.message);
				
			}

		},
		error : function(error) {
			alert(error);
			self.onError(error);
		}
	});
},
// 添加
onNew : function(item) {
},
onDelete:function(item){
},

// 关联事件
connectEvt: function() {
	dojo.connect(this.store, "onSet", this,this.onSet);
	dojo.connect(this.store, "onNew", this,this.onNew);
	dojo.connect(this.store, "onDelete",this, this.onDelete);
	dojo.forEach(["onCellDblClick"], function(ev){
		dojo.connect(this.dataGrid, ev, this,function(e){
//			console.log(this);
//			console.log(e);
//			alert(e.cellIndex);
//			alert(e.rowIndex);
			if(e.cellIndex==5){
				console.log(this.dataGrid.getItem(e.rowIndex));
				dijit.byId("addDlg").show();
			}
			
			
		});
	},this);
	
},
// 创建表格
getDataGrid:function(){
	return this.dataGrid;
},
// 取得分页信息
getPagination : function(parameter) {
	var parameter = parameter || {
		"manuPlan.pageNumber" : 1,
		"manuPlan.pagesize" : 10
	};
	dojo.xhrPost( {
		url : "manuPlan!doGetManuPlanPagination.action",
		content : parameter,
		handleAs : "json",
		load : function(response) {
			dojo.byId("pagination_Panel").innerHTML = response;
		},
		error : function(error) {
			alert("获取分页信息时出错 : " + error);
			dojo.byId("pagination_Panel").innerHTML = "";
		}
	});
},
// 获取数据
getDataList:function(pageNumber, pagesize) {
	var parameter = {
		"manuPlan.pageNumber" : pageNumber || 1,
		"manuPlan.pagesize" : pagesize || 10
	};
//	this.store = new dojo.data.ItemFileWriteStore( {
//		url : "manuPlan!doGetManuPlanList.action?"
//				+ dojo.objectToQuery(parameter)
//	});
	this.dataGrid.setStore(null);
	this.dataGrid.showMessage(this.dataGrid.loadingMessage);
	var self=this;
	dojo.xhrPost({
		self:self,
		url: "manuPlan!doGetManuPlanList.action",
		content: parameter,
		handleAs : "json",
		load : function(response) {
			console.log(self);
			if(response.id=="0"){
				self.dataGrid.showMessage(self.dataGrid.errorMessage+response.message);
			}else{
				self.store=new dojo.data.ItemFileWriteStore(
						{
							data:response
						});
					// 关联事件
						self.connectEvt(self.store);
						self.dataGrid.setStore(self.store);
			}
			
				},
		error : function(error) {
			alert("读取数据列表时出错 3 :An unexpected error occurred: " + error);
		}
		
	});
	
	
	// 刷新表格
	this.dataGrid.setStore(this.store);
	// 获取分页
	this.getPagination(parameter);
},
// 发生错误时
onError:function(error){
	dojo.publish("promptMessageTopic",[{message: "数据更新错误。",type: "message", duration: 1000}]);
	alert(error);
	this.revert();
	},
// 完成操作时
onComplete:function(){
		dojo.publish("promptMessageTopic",[{message: "数据更新成功。",type: "message", duration: 1000}]);
	},
deleteManuPlan:function(){
	var deleteItemIds=this.dataGrid.selection.getSelected();
	console.log("deleteItemIds");
	console.log(deleteItemIds);
	console.log(this.store.getValue(deleteItemIds[0],"id"))
	alert(deleteItemIds.length);
	if(!deleteItemIds.length){
		return false;
	}
	if (!confirm('是否删除所选的记录?')) {
		return false;
	}
	
	var deleteItemIds;
	var n=0;
	var self=this;
	dojo.forEach(deleteItemIds,function(item){
		if(!deleteItemIds){
			deleteItemIds=[];
		}
		deleteItemIds[n++]=self.store.getValue(item,"mpId");
	});
	
	var parameter={"manuPlan.id":deleteItemIds.join()};
	
	dojo.xhrPost( {
		url : "manuPlan!doDeleteManuPlan.action",
		handleAs : "json",
		content : parameter,
		load : function(response) {
			if (response.id != "0") {
				self.dataGrid.removeSelectedRows();
				self.store.save();
				self.getDataList(1, 10);
				self.onComplete();
			} else {
				self.onError(response.message);
			}

		},
		error : function(error) {
			alert(error);
			self.onError(error);
		}
	});

},
// 初始化
init : function() {
	this.dataGrid.showMessage(this.dataGrid.loadingMessage);
	var self=this;
	dojo.xhrPost({
		self:self,
		url: "manuPlan!doGetManuPlanList.action",
		content: {"manuPlan.pageNumber":1,"manuPlan.pagesize":10},
		handleAs : "json",
		load : function(response) {
			console.log(self);
			if(response.id=="0"){
				self.dataGrid.showMessage(self.dataGrid.errorMessage+response.message);
			}else{
				self.store=new dojo.data.ItemFileWriteStore(
						{
							data:response
						});
						self.connectEvt(self.store);
						self.dataGrid.setStore(self.store);
			}
			
				},
		error : function(error) {
			alert("读取数据列表时出错 3 :An unexpected error occurred: " + error);
		}
		
	});
	
	
	
	
	
	dojo.byId("dataGridDiv").appendChild(this.dataGrid.domNode);
	this.dataGrid.startup();
	this.getPagination();
},
showLoadingMes:function(){
	this.dataGrid.setStore(null);
	this.dataGrid.showMessage(this.dataGrid.loadingMessage);
}

});

var manuPlan=new ManuPlan();


<div class="search_Panel">
		<form id="searchPanelForm" dojoType="dijit.form.Form"><input
			type="text" id="filterKeys" name="manuPlan.filterKeys"
			data-dojo-type="dijit.form.ValidationTextBox"
			data-dojo-props='maxlength:50,promptMessage:"请输入查询条件",tooltipPosition:"above" ' />

		<button data-dojo-type="dijit.form.Button"
			data-dojo-props='onClick:function(evt){manuPlan.getDataList();}'>查
		询</button>
		    
		<button data-dojo-type="dijit.form.Button"
			data-dojo-props='disabled:true,onClick:function(evt){manuPlan.dataGrid.edit.apply(); this.set("disabled",disabled);}'>应用</button>
		    
		<button data-dojo-type="dijit.form.Button"
			data-dojo-props='disabled:true,onClick:function(evt){manuPlan.dataGrid.edit.cancel();this.set("disabled",disabled);}'>取消</button>
		    
		<button data-dojo-type="dijit.form.Button"
			data-dojo-props="onClick:function(evt){manuPlan.deleteManuPlan();}">删除</button>
		    
		
		<button id="showAddDlgButton" data-dojo-type="dijit.form.Button"
			data-dojo-props='onClick:function(){ dijit.byId("addDlg").show() }'>添加</button>
		<button id="sshowModifiedItemsButton" data-dojo-type="dijit.form.Button"
			data-dojo-props='onClick:function(){ manuPlan.showLoadingMes(); }'>message</button>
		<button id="singleClickEditButton" data-dojo-type="dijit.form.Button"
			data-dojo-props="onClick:function(){ dijit.byId('dataGrid').singleClickEdit = !manuPlan.getDataGrid().singleClickEdit; }">单击编辑开关</button>

		</form>

		</div>
网友评论