ssm 框架用户的增删改查（前天jsp写的）

首先就是创建用户表了

package com.xblh.pojo;

第二步，dao层

第三步：数据库查询

因为为了分页方便最好创建一个工具类

service层

控制层

最后一步就是前台页面了，前台我是用easyui 做的

<%@ 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">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

<title>欢迎使用XXXXXXXXX</title>

</head>
<body>
<div id="tool" style="padding: 5px; height: auto">
<a href="#" class="easyui-linkbutton"
data-options="iconCls:'icon-add'" onClick="openUserWin(1)">添加用户</a>
<a href="#" class="easyui-linkbutton" data-options="iconCls:'icon-edit'"
onClick="openUserWin(2)">修改用户</a> <a href="#"
class="easyui-linkbutton" data-options="iconCls:'icon-remove'"
onClick="deleteUser()">删除用户</a> <input type="text" id="name"
name="name">用户名 <input type="text" id="position"
name="position">职位 <a href="#" class="easyui-linkbutton"
data-options="iconCls:'icon-search'" onClick="selectLike()">查询</a>
</div>


<table method="get" id="userGrid" class="easyui-datagrid"
title="用户信息列表"
style="width: 1200px; height: 800px; padding-left: 300px"
data-options=" rownumbers:true,
singleSelect:true,
url:'getUserPage',
method:'get',
pagination:true,
pagePosition:'bottom',
pageSize:20,
pageList:[2,3,4,5,6,20],
toolbar:'#tool'
">

<thead>
<tr>
<th data-options="field:'ck',checkbox:true"></th>

<th data-options="field:'uUsername',width:100">用户名</th>
<th data-options="field:'uPassword',width:100">账号密码</th>
<th data-options="field:'uRoleid',width:100" formatter="uRoleid">角色id</th>
<th data-options="field:'uBegin',width:300">用户注册时间</th>
<th data-options="field:'uState',width:100" formatter="formatter">用户状态</th>

<th data-options="field:'uPosition',width:100">职位</th>
</tr>
</thead>
</table>

<div id="deptDialog" class="easyui-dialog" style="width: 500px; height: 500px;" data-options="iconCls:'icon-save',closed:true,title:'用户列表'">
<form id="userForm" method="post" style="width: 500px; padding-left: 100px;">
<div>
<input class="easyui-textbox" id="uId" name="uId">
</div>
<div>
用户名<input class="easyui-textbox" id="uUsername" name="uUsername"
placeholder="用户名">


</div>
<p></p>
<div>
用户密码<input class="easyui-textbox" id="uPassword" name="uPassword"
placeholder="密码">
</div>
<p></p>
<div>
用户类型 <select class="easyui-combobox" name="uRoleid" id="uRoleid">
<option value="1">普通用户</option>
<option value="3">管理员</option>
</select>

</div>
<p></p>
<div>
用户注册时间<input class="easyui-datebox" id="uBegin" name="uBegin"
placeholder="用户注册时间">
</div>
<p></p>
<div>
用户账号状态

<select class="easyui-combobox" name="uState" id="uState">
<option value="1">禁用</option>
<option value="2">启用</option>
</select>

</div>
<p></p>
<div>
公司id<input class="easyui-textbox" id="uCompanyId" name="uCompanyId"
placeholder="公司id">
</div>
<p></p>
<div>
职位<input class="easyui-textbox" id="uPosition" name="uPosition"
placeholder="职位">
</div>
<p></p>
<div>
<a href="#" class="easyui-linkbutton" iconCls="icon-ok"
style="width: 100%; height: 32px; margin-top: 20px"
onclick="submitForm1()"> <span style="font-size: 14px;">提交</span>
</a>
</div>
</form>
</div>

<script type="text/javascript">

var urr;
//修改
function openUserWin(flag) {
if (flag != 1) {
var rows = $('#userGrid').datagrid('getChecked');
if (rows.length != 1) {
winAlert("提示", "请选择一行进行修改");
} else {

var data = rows[0];
$('#uId').textbox("setValue",data.uId);
$('#uUsername').textbox("setValue",data.uUsername);
$('#uPassword').textbox("setValue",data.uPassword);
$('#uRoleid').combobox("setValue",data.uRoleid);
$('#uBegin').datebox("setValue",data.uBegin);
$('#uState').combobox("setValue",data.uState);
$("#uCompanyId").textbox("setValue",data.uCompanyId);
$("#uPosition").textbox("setValue",data.uPosition);
urr = "updateUserByIds";
$("#deptDialog").dialog('open');

}
} else {
urr = "insertUser";
$("#deptDialog").dialog('open');
}
}

function winAlert(title, msg) {
$.messager.show({
title : title,
msg : msg,
showType : 'fade',
style : {
right : '',
bottom : ''
}
});
}

function submitForm1() {
$('#userForm').form('clear');
$('#userForm').form({
url : urr,
success : function(data) {
winAlert("提示", "操作成功"),
$("#deptDialog").dialog('close');
$('#userGrid').datagrid('reload');
},
errer : function(data) {
winAlert("提示", "操作失败");

}
});

$('#userForm').form('submit');
}
function formatter(value, row, index) {
if (row.uState == 1) {
return "禁用";
} else {
return "启用";
}
}
function uRoleid(value, row, index) {
if (row.uRoleid == 1) {
return "普通用户";
} else {
return "管理员"
}
}

//删除
function deleteUser() {
//获取选中的首行
var rows = $('#userGrid').datagrid('getSelected');
//如果没有选中一行，提示用户选中一行
if (rows == null) {
winAlert("提示", "请选择一行");
} else {
//选中了就把选中行的id赋给id
var id = rows.uId
$.ajax({
url : 'deleteUserById',
data : {
uId : id
},
//ajax获取远程数据成功，就调用回调函数
success : function(data) {
winAlert("提示", "操作成功");
//加载最新页面，删除后重新加载页面
$('#userGrid').datagrid('reload');
},
//ajax获取远程数据失败，就调用回调函数
errer : function() {
winAlert("提示", "操作失败");
}
});
}
}
//条件查询
function selectLike() {
//把id为name文本框的值赋给name;
var name = $('#name').val();
//把id为position文本框的值赋给position;
var position = $('#position').val();
//定义参数
var param = {
uUsername : name,
uPosition : position
}
//reload:重新加载，把id为userGRID的数据表格把参数传过去后重新加载;
$("#userGrid").datagrid("reload", param);
}
</script>
</body>

</html>

然后数据库

大功告成，如有疑问，可加本人微信，免费答疑

l13006157738

ssm 框架用户的增删改查（前天jsp写的）

猜你喜欢