easyui的crud(dialog,datagrid、form讲解)
1、?打开tab页
2、?创建dao
3、?Web的增删改查与配置
4、?使用datagrid承载查询数据
5、?增加和修改使用dialog与form
6、?使用ajax做删除
7、?解决tab页面重复的问题
前台代码
$(function() {
var ctx = $("#ctx").val();
$('#dg').datagrid({
url : ctx+'/userAction.action?methodName=list',
fitColumns : true,
pagination : true,
columns : [ [ {
field : 'uid',
title : 'ID',
width : 100
}, {
field : 'uname',
title : '名称',
width : 100
}, {
field : 'upwd',
title : '密码',
width : 100
} ] ],
toolbar : [ {
iconCls : 'icon-edit',
handler : function() {
var row = $('#dg').datagrid("getSelected");
if(row){
//读取所选记录填充到表单中
$('#ff').form('load', row);
//打开窗体
$("#dd").dialog('open');
}else{
alert("请选择!");
}
}
}, '-', {
iconCls : 'icon-add',
handler : function() {
//打开窗体
$("#dd").dialog('open');
}
}, '-', {
//删除按钮
iconCls : 'icon-remove',
handler : function() {
var row = $('#dg').datagrid("getSelected");
if(row){
$.messager.confirm('确认对话框', '你确定要删除吗?', function(r){
if (r){
$.ajax({
//跳转增加地址
url:ctx+'/userAction.action?methodName=del&&SerialNo='+row.SerialNo,
dataType:'json' ,
success:function(result){
$.messager.alert('提示信息', result);
if(result==1){
$.messager.alert('提示信息', '操作成功');
}else{
$.messager.alert('提示信息', '操作失败');
}
}
});
// 重新载入当前页面数据
$('#dg').datagrid('reload');
}
});
}else{
$.messager.alert('提示信息', '请选择要删除的列!');
}
}
} ]
});
})
function ok() {
var ctx = $("#ctx").val();
var serialNo = $("#SerialNo").val();
if(serialNo==""){
//增加
$('#ff').form('submit',{
//跳转增加地址
url:ctx+'/userAction.action?methodName=add',
});
//关闭窗体
$("dd").dialog('close');
}else{
alert("修改");
//修改
$('#ff').form('submit',{
//跳转修改地址
url:ctx+'/userAction.action?methodName=update'
});
}
}