Easyui接收後臺json數據處理的小結(二)

       EasyUI的combobox級聯之後,我又遇到了EasyUI與後臺交互的問題,在此次的小項目中主要是Spring的restful四種行爲get,post,put和delete實現查、增、改、刪。開始時由於增加和修改都使用同一個表單,總是無法修改。後發現原因是一是form表單只默認兩種方法即post和get,二是其提交方式一旦寫定都無法修改,後來只能另寫一個表單load選中的datagrid的行,然後使用Ajax方法提交要修改的數據,js代碼如下
function editData(){
	var selectedRows=dg1.datagrid('getSelections');//選中要編輯的行
	if(selectedRows.length!=1){
		$.messager.alert("系統提示","請選擇一條要編輯的數據!");
		return;
	}
	var row=selectedRows[0];
	$("#dlg1").dialog("open").dialog("setTitle","編輯年級信息");
	$("#fm1").form("load",row);
}

function saveEditData(){
	var selectedRows=dg1.datagrid('getSelections');
	if(selectedRows.length!=1){
		return;
	}
	var row=selectedRows[0];
	$.ajax({
		type:'put',                       //put方法進行修改
		url:'api/class/'+row.idcls+'/'+$("#clsnum1").val(),
		success:function(result){
			if(result.errorMsg){
				$.messager.alert("系統提示",result.errorMsg);
				return;
			}else{
				$.messager.alert("系統提示","保存成功");
				$("#fm1").form("clear");
				$(" #dlg1").dialog("close");
				dg1.datagrid("reload");
			}
		}
	});
}

在restful中直接接受表單數據,這裏不再贅述。由於刪除行爲,後臺沒有寫多條記錄同時刪除,所以我就寫了一個for函數,代碼如下:

function deleteData(){
	var selectedRows=dg1.datagrid('getSelections');
	if(selectedRows.length==0){
		$.messager.alert("系統提示","請選擇要刪除的數據!");
		return;
	}
	var strIds=[];
	for(var i=0;i<selectedRows.length;i++){
		strIds.push(selectedRows[i].idcls);
	}
	$.messager.confirm("系統提示","您確認要刪掉這<font color=red>"+selectedRows.length+"</font>條數據嗎?",function(r){
		 if(r){
		     for(var i=0;i<strIds.length;i++){
				var ids=strIds[i];
				$.ajax({
					url:'api/class/id='+ids,
					type:'delete',
					dataType:'json',
					success:function(result){
						dg1.datagrid("reload");
					},
				    error: function (msg) { 
				    	alert(msg); 
					} 
				});
		     };
		     dg1.datagrid('unselectAll');
		 }
	});
}
查詢功能最好實現,沒有遇到任何問題:

function searchData(){
	url="api/class/key="+ $("#searchs").val(),
	dg1.datagrid('load',url);
}
歡迎大家指正


發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章