通过form表单的序列化,将所有查询参数作为一个对象传送到后台
function submitQuery(){
doing();
$('#list_data').datagrid({
url : '<%=basePath%>/user/list.do?'+$('form').serialize()
});
//查询后的分页控件
var p = $('#list_data').datagrid('getPager');
$(p).pagination({
showRefresh : false
});
return false;
}
通过dialog控件加载对应字段输入框并展现
对应的js
var url;
function newUser(){
$('#dlg').dialog('open').dialog('center').dialog('setTitle','新增用户信息');
$('#fm').form('clear');
url = '<%=basePath%>/user/add.do?';
}
function editUser(rowIndex,rowData){
$('#dlg').dialog('open').dialog('center').dialog('setTitle','修改用户信息');
$('#fm').form('load',{
//usr_usruuid:rowData.usr_usruuid,
usr_id:rowData.usr_id,
usr_name:rowData.usr_name,
usr_status:rowData.usr_status,
usr_type:rowData.usr_type,
usr_mobile:rowData.usr_mobile,
usr_email:rowData.usr_email,
usr_employeeid:rowData.usr_employeeid
});
url = '<%=basePath%>/user/edit.do?usruuid='+rowData.usr_usruuid+'&';
}
function saveUser(){
$('#fm').form({
url: url+$(this).serialize(),
onSubmit: function(){
return $(this).form('validate');
},
success: function(result){
console.log(result);
var dataObj = JSON.parse(result);
console.log(dataObj);
if (dataObj.result){
alert(dataObj.success);
$('#dlg').dialog('close'); // close the dialog
$('#dg').datagrid('reload'); // reload the user data
} else {
$.messager.show({
title: 'Error',
msg: dataObj.error
});
}
}
});
$('#fm').submit();
}
其中批量删除对应的js
{
text: '删除',
iconCls: 'icon-remove',
handler: function(){
var rowObj=$('#list_data').datagrid("getSelections");
if(rowObj.length == 0){
$.messager.alert('提示框','请选择数据!');
}else{
var uuids = "";
for(var i=0;i/user/batdel.do',
'type':'post',
'data':{'uuids':uuids},
'dateType':'xml',
'success':function(data){
//doing();
$.messager.alert('提示框','删除成功!');
$('#list_data').datagrid("clearSelections");
$('#list_data').datagrid('reload');
},error : function(data) {
$.messager.alert('友情提示','请稍后再试');
}
});
}
});
}
}
}
replace(uuid(),'-',''),听说这种方式影响查询效率,可以参考其它方式实现
Ajax中是success参数返回的应该是一个json格式的数据,可以是一个对象,或字符串,尝试过多种方式,最终选择返回对象
使用JSON.parse(result)将结果转换成对象,如下:
success: function(result){
console.log(result);
var dataObj = JSON.parse(result);
console.log(dataObj);
if (dataObj.result){
alert(dataObj.success);
$('#dlg').dialog('close'); // close the dialog
$('#dg').datagrid('reload'); // reload the user data
} else {
$.messager.show({
title: 'Error',
msg: dataObj.error
});
}
}
@RequestMapping(value = "add")
@ResponseBody
public Map addUser(HttpServletRequest request,HttpServletResponse response,
DapUser dapUser) {
System.out.println("---------开始被调用啦------");
System.out.println(dapUser.toString());
Map resultMap = new HashMap();
DapUser existDapUser = new DapUser();
existDapUser = userService.findUserByUserId(dapUser.getUsr_id());
if(existDapUser!=null){
resultMap.put("result", false);
resultMap.put("error", "系统已经存在该登录账号");
}else{
userService.addDapUser(dapUser);
resultMap.put("result", true);
resultMap.put("success", "新增用户成功");
}
return resultMap;
}
其中还有更多实现上的细节,需要在实践过程中慢慢发现,以下是最终实现简单CRUD的功能截图,
仅以此记录下国庆节自己呆宿舍发霉的第五天,谢谢。