dojo dataGrid 异步保存数据

前端之家收集整理的这篇文章主要介绍了dojo dataGrid 异步保存数据前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
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.onNew);
	dojo.connect(this.store,"onDelete",this.onDelete);
	dojo.forEach(["onCellDblClick"],function(ev){
		dojo.connect(this.dataGrid,ev,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",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,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: "数据更新成功。",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",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,content: {"manuPlan.pageNumber":1,"manuPlan.pagesize":10},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>

猜你在找的Dojo相关文章