easyui分页图:
前段代码:
注意:
这里要分清楚里面他们的差别,不然传入的ID就不正确,就进不了Controller里面的删除方法
如果删除一行用getselected,如果删除多行用getselections,传入的就是一个数组
//获取一行的所有元素
var row=$("#dg").datagrid("getSelected");
//获取所有选中行的所有元素
var selectedRows=$("#dg").datagrid("getSelections");
很烦,用下面这种方法不能很好的展示easyui里面的修改和删除的图标,所以暂且这样写着,以后学到更好的方法再改
//行内添加链接
function formatOper(val,row,index){
var b="";
b+= '<a href="javascript:openBlogTypeModifyDialog()" rel="external nofollow" onclick="editUser('+index+')" ><img src="static/jquery-easyui-1.5.4.2/themes/icons/pencil.png" />修改</a> ';
b+= '<a href="javascript:deleteBlogType()" rel="external nofollow" ><img src="static/jquery-easyui-1.5.4.2/themes/icons/cancel.png" />删除</a>';
return b;
}
点击添加按钮的时候发现里面显示有默认值,然后不知道为什么用
$("#resName").val("");
这种方式清空不了添加弹框的默认值,用这种才解决
$("#isParent").textbox("setValue", "");
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<%
String path = request.getContextPath();
String basePath = request.getScheme() + "://"
+ request.getServerName() + ":" + request.getServerPort()
+ path + "/";
%>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>系统菜单管理</title>
<link rel="stylesheet" type="text/css" href="static/jquery-easyui-1.5.4.2/themes/default/easyui.css">
<link rel="stylesheet" type="text/css" href="static/jquery-easyui-1.5.4.2/themes/icon.css">
<script type="text/javascript" src="static/jquery-easyui-1.5.4.2/jquery.min.js"></script>
<script type="text/javascript" src="static/jquery-easyui-1.5.4.2/jquery.easyui.min.js"></script>
<script type="text/javascript" src="static/jquery-easyui-1.5.4.2/locale/easyui-lang-zh_CN.js"></script>
<style type="text/css">
</style>
<script type="text/javascript">
//模糊查询,再次加载数据
function searchBlog(){
$("#dg").datagrid('load',{
"resName":$("#s_title").val()
});
/* alert($("#s_title").val()); */
}
//行内添加链接
function formatOper(val,row,index){
/* alert("ddd"); */
var b="";
b+= '<a href="javascript:openBlogTypeModifyDialog()" rel="external nofollow" onclick="editUser('+index+')" ><img src="static/jquery-easyui-1.5.4.2/themes/icons/pencil.png" />修改</a> ';
b+= '<a href="javascript:deleteBlogType()" rel="external nofollow" ><img src="static/jquery-easyui-1.5.4.2/themes/icons/cancel.png" />删除</a>';
return b;
}
//修改
function openBlogTypeModifyDialog(){
var selectedRows=$("#dg").datagrid("getSelections");
if(selectedRows.length!=1){
$.messager.alert("系统提示","请选择一个要修改的系统菜单类别!");
return;
}
var row=selectedRows[0];
$("#dlg").dialog("open").dialog("setTitle","修改系统菜单类别信息");
$("#fm").form("load",row);
url="${request.contextPath}/yuanguoRDP1/save?resId="+row.resId;
//alert(row.resId);
}
//添加
function addResource(){
$("#dlg").dialog("open").dialog("setTitle","添加菜单信息");
url="${request.contextPath}/yuanguoRDP1/save";
//resetValue();//清空数据
}
//保存
function saveBlogType(){
$("#fm").form("submit",{
url:url,
onSubmit:function(){
return $(this).form("validate");
},
success:function(result){
var result=eval('('+result+')');
if(result.success){
$.messager.alert("系统提示","保存成功!");
resetValue();//清空数据
$("#dlg").dialog("close");
$("#dg").datagrid("reload");
}else{
$.messager.alert("系统提示","保存失败!");
return;
}
}
});
}
//关闭
function closeBlogTypeDialog(){
$("#dlg").dialog("close");
resetValue();
}
//清除
function resetValue(){
//alert("开始清除!");
/*这种方式并不能清空输入框的值
$("#isParent").val("");
$("#resName").val("");
$("#resLink").val("");
$("#sortNum").val(""); */
$("#isParent").textbox("setValue", "");
$("#resName").textbox("setValue", "");
$("#resLink").textbox("setValue", "");
$("#sortNum").textbox("setValue", "");
//alert("清除成功!"+row.resName);
}
/* function editUser(index){
$('#dg').datagrid('selectRow',index);// 关键在这里
var row = $('#dg').datagrid('getSelected');
if (row){
$('#dlg').dialog('open').dialog('setTitle','修改学生信息');
$('#fm').form('load',row);
url = '${ctx}updateStudent.do?id='+row.id;
}
} */
//删除
function deleteBlogType(){
//获取一行的所有元素
var row=$("#dg").datagrid("getSelected");
//获取所有选中行的所有元素
var selectedRows=$("#dg").datagrid("getSelections");
//alert(row.resName+"@@"+row.resId);
/* if(selectedRows.length==0){
$.messager.alert("系统提示","请选择要删除的数据!");
return;
} */
/* var strIds=[];
for(var i=0;i<selectedRows.length;i++){
strIds.push(selectedRows[i].id);
}
var ids=strIds.join(","); */
$.messager.confirm("系统提示","您确定要删除这<font color=red>"+selectedRows.length+"</font>条数据吗?",function(r){
if(r){
$.post("${request.contextPath}/yuanguoRDP1/deleteResource",
{resId:row.resId},function(result){
if(result.success){
if(result.exist){
$.messager.alert("系统提示",result.exist);
}else{
$.messager.alert("系统提示","数据已成功删除!");
}
$("#dg").datagrid("reload");
}else{
$.messager.alert("系统提示","数据删除失败!");
}
},"json");
}
});
}
</script>
</head>
<body style="margin: 1px">
<table id="dg" title="系统菜单管理" class="easyui-datagrid"
fitColumns="true" pagination="true" rownumbers="true" singleSelect="true"
url="${request.contextPath}/yuanguoRDP1/Resourcelist" fit="true" toolbar="#tb">
<thead>
<tr>
<!-- <th field="cb" checkbox="true" align="center"></th> -->
<th field="resName" width="200" align="center">菜单名称</th>
<th field="resLink" width="50" align="center">链接</th>
<th field="sortNum" width="50" align="center" >排序号</th>
<th field="status" width="100" align="center" >状态</th>
<th field="_operate"width="80" align="center" formatter="formatOper">操作</th>
</tr>
</thead>
</table>
<div id="tb">
<div>
<a href="javascript:addResource()" class="easyui-linkbutton" iconCls="icon-add" plain="true">添加菜单</a>
</div>
<div>
菜单名称 <input type="text" id="s_title" size="20" onkeydown="if(event.keyCode==13) searchBlog()"/>
<a href="javascript:searchBlog()" class="easyui-linkbutton" iconCls="icon-search" plain="true">搜索</a>
</div>
</div>
<div id="dlg" class="easyui-dialog" style="width: 400px;height: 300px;padding: 10px 20px" closed="true" buttons="#dlg-buttons">
<form id="fm" method="post">
<table cellspacing="8px">
<tr>
<td>上级菜单</td>
<td>
<select name="isParent" id="isParent" class="easyui-combobox" >
<option value="1" selected = "selected" >父节点</option>
<option value="0">否</option>
</select>
</td>
</tr>
<tr>
<td>菜单名称</td>
<td><input type="text" name="resName" id="resName" class="easyui-textbox" style="width:100%;" required="true" data-options="prompt:'请填写菜单名称'" ></td>
</tr>
<tr>
<td>链接</td>
<td><input type="text" name="resLink" id="resLink" class="easyui-textbox" style="width:100%;" required="true" data-options="prompt:'请填写链接'"></td>
</tr>
<tr>
<td>排序号</td>
<td><input type="text" name="sortNum" id="sortNum" class="easyui-textbox" style="width:100%;" required="true" data-options="prompt:'请填写序号'"></td>
</tr>
</table>
</form>
</div>
<div id="dlg-buttons">
<a href="javascript:saveBlogType()" class="easyui-linkbutton" iconCls="icon-ok">保存</a>
<a href="javascript:closeBlogTypeDialog()" class="easyui-linkbutton" iconCls="icon-cancel">关闭</a>
</div>
</body>
</html>
后台代码如下
控制层Controller
/**
* 分页查询显示系统菜单
* */
@RequestMapping("/Resourcelist")
public String list(Resource resource,HttpServletRequest request,HttpServletResponse response)throws Exception{
int page =Integer.parseInt(request.getParameter("page")) ;// 第几页
int rows = Integer.parseInt(request.getParameter("rows"));//存放每页记录数
PageBean pageBean=new PageBean(page,rows);
Map<String,Object> map=new HashMap<String,Object>();
map.put("resName",StringUtils.formatLike(resource.getResName()) );
map.put("start",pageBean.getStart());// 始页第一条数
map.put("size", pageBean.getPageSize());// 每页记录数
//设置前台状态,把数字转化成文字
List<Resource> resList=resourceService.list(map);
for (Resource resource2 : resList) {
if(Integer.parseInt(resource2.getStatus())==1){
resource2.setStatus("正常");
}else{
resource2.setStatus("禁用");
}
}
long total=resourceService.getTotal(map);
//System.out.println("zhe???"+total);
JSONObject result=new JSONObject();
result.put("rows", resList);//存放每页记录数
result.put("total",total);//存放总记录树
//System.out.println(result);
ResponseUtil.write(response,result);
return null;
}
/**
* 添加或者修改系统菜单
* */
@RequestMapping("/save")
public String save(Resource resource,HttpServletResponse response)throws Exception{
int resultTotal=0;
if(resource.getResId()==null){
resultTotal=resourceService.addResource(resource);
}else{
resultTotal=resourceService.updateResource(resource);
}
JSONObject result=new JSONObject();
if(resultTotal>0){
result.put("success", true);
}else{
result.put("success", false);
}
ResponseUtil.write(response, result);
return null;
}
/**
* 系统菜单删除
*/
@RequestMapping("/deleteResource")
public String delete(@RequestParam(value="resId",required=false)String resId,HttpServletResponse response)throws Exception{
System.out.println("进来了!!!!");
System.out.println(resId);
int resultTotal=0;
resultTotal=resourceService.DeleatResource(Integer.parseInt(resId));
System.out.println(resultTotal);
JSONObject result=new JSONObject();
if(resultTotal>0){
result.put("success", true);
}else{
result.put("success", false);
}
ResponseUtil.write(response, result);
return null;
}
@RequestMapping("/tolist")
public String listGG(){
return "resource";
}
service,dao层分页,添加,修改,删除:
/**
* 分页查询菜单管理
* @param map
* @return
*/
public List<Resource> list(Map<String,Object> map);
//查询系统菜单总数
Long getTotal(Map<String, Object> map);
//修改系统菜单
Integer updateResource(Resource resource);
//新增系统菜单
Integer addResource(Resource resource);
//删除系统菜单信息
Integer DeleatResource(Integer resId);
mapper.xml
<select id="list" parameterType="Map" resultMap="BaseResultMap">
select * from ta_autho_resource where is_delete='0'
<if test="resName!=null and resName!=''">
and res_name LIKE CONCAT('%',#{resName},'%')
</if>
<if test="resLink!=null and resLink!='' ">
and res_link=#{resLink}
</if>
<if test="sortNum!=null and sortNum!='' ">
and sort_num=#{sortNum}
</if>
<if test="status!=null and status!='' ">
and status=#{status}
</if>
<if test="isParent!=null and isParent!='' ">
and is_parent =#{isParent}
</if>
<if test="isDelete!=null and isDelete!='' ">
and is_parent =0
</if>
<if test="start!=null and size!=null">
limit #{start},#{size}
</if>
</select>
<select id="getTotal" parameterType="Map" resultType="Long">
select count(*) from ta_autho_resource where is_delete='0'
<if test="resName!=null and resName!=''">
and res_name LIKE CONCAT('%',#{resName},'%')
</if>
<if test="resLink!=null and resLink!='' ">
and res_link=#{resLink}
</if>
<if test="sortNum!=null and sortNum!='' ">
and sort_num=#{sortNum}
</if>
<if test="status!=null and status!='' ">
and status=#{status}
</if>
<if test="isParent!=null and isParent!='' ">
and is_parent =#{isParent}
</if>
<if test="isDelete!=null and isDelete!='' ">
and is_parent =0
</if>
</select>
<update id="updateResource" parameterType="com.yuanguo.systemManage.entity.Resource">
update ta_autho_resource
<set >
<if test="resName != null" >
RES_NAME = #{resName,jdbcType=VARCHAR},
</if>
<if test="parentResId != null" >
PARENT_RES_ID = #{parentResId,jdbcType=INTEGER},
</if>
<if test="resLink != null" >
RES_LINK = #{resLink,jdbcType=VARCHAR},
</if>
<if test="sortNum != null" >
SORT_NUM = #{sortNum,jdbcType=INTEGER},
</if>
<if test="remark != null" >
REMARK = #{remark,jdbcType=VARCHAR},
</if>
<if test="resType != null" >
RES_TYPE = #{resType,jdbcType=CHAR},
</if>
<if test="registerTime != null" >
REGISTER_TIME = #{registerTime,jdbcType=TIMESTAMP},
</if>
<if test="registerUserId != null" >
REGISTER_USER_ID = #{registerUserId,jdbcType=INTEGER},
</if>
<if test="updateTime != null" >
UPDATE_TIME = #{updateTime,jdbcType=TIMESTAMP},
</if>
<if test="updateUserId != null" >
UPDATE_USER_ID = #{updateUserId,jdbcType=INTEGER},
</if>
<if test="isParent != null" >
IS_PARENT = #{isParent,jdbcType=INTEGER},
</if>
<if test="status != null" >
STATUS = #{status,jdbcType=CHAR},
</if>
</set>
where RES_ID = #{resId,jdbcType=INTEGER}
</update>
<insert id="addResource" parameterType="com.yuanguo.systemManage.entity.Resource">
INSERT INTO ta_autho_resource (is_parent,res_name,res_link,sort_num) VALUES(#{isParent},#{resName},#{resLink},#{sortNum})
</insert>
<update id="DeleatResource" parameterType="com.yuanguo.systemManage.entity.Resource">
update ta_autho_resource set is_delete=1 where RES_ID = #{resId,jdbcType=INTEGER}
</update>