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' }); }}