jQuery EasyUi 增删改查

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

猜你喜欢

转载自blog.csdn.net/weixin_43224629/article/details/83066943