1. 程式人生 > >ssh+easiui 增刪改查 例項

ssh+easiui 增刪改查 例項

頁面

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>部門管理</title>
<link rel="stylesheet" type="text/css" href="ui/themes/default/easyui.css">
<link rel="stylesheet" type="text/css" href="ui/themes/icon.css">
<script type="text/javascript" src="ui/jquery.min.js"></script>
<script type="text/javascript" src="ui/jquery.easyui.min.js"></script>
<script type="text/javascript" src="ui/locale/easyui-lang-zh_CN.js"></script>
<script type="text/javascript" src="ui/jquery.serializejson.min.js"></script>


<script type="text/javascript">
var method = "";
$(function(){
	//$.messager.alert("提示",[{"name":"管理員組","tele":"000000","uuid":1},{"name":"總裁辦","tele":"111111","uuid":2},{"name":"採購部","tele":"222222","uuid":3},{"name":"銷售部","tele":"333333","uuid":4},{"name":"公關部","tele":"444444","uuid":5},{"name":"行政部","tele":"555555","uuid":6},{"name":"人事部","tele":"555555","uuid":7},{"name":"運輸部","tele":"444444","uuid":8},{"name":"黨辦","tele":"555555","uuid":9},{"name":"工會","tele":"555555","uuid":10},{"name":"倉儲部","tele":"555555","uuid":11},{"name":"客服部","tele":"555555","uuid":12},{"name":"財務部","tele":"555555","uuid":13},{"name":"運營部","tele":"555555","uuid":14}]);
	$('#grid').datagrid({    
	    url:'dep_list',    
	    columns:[[    
	        {field:'id',title:'部門編號',width:100},    
	        {field:'name',title:'部門名稱',width:100},    
	        {field:'tele',title:'部門聯絡電話',width:100,align:'left'},
	        {field:'-',title:'操作',formatter: function(value,row,index){
	        	//value:欄位值。rowData:行記錄資料。rowIndex: 行索引
	        	var oper = "<a href=\"javascript:void(0)\" onclick=\"edit(" + row.id + ')">修改</a>';
	        	oper += ' <a href="javascript:void(0)" onclick="del(' + row.id + ')">刪除</a>';
	        	return oper;
			}}
	    ]],
	    singleSelect: true,
	    pagination: true,
	    toolbar: [{
	    	text: '新增',
			iconCls: 'icon-add',
			handler: function(){
				method = "add";
				$('#editDlg').dialog('open');
			}
		}]
	});
	
	$('#btnSearch').bind('click',function(){
		//把表單資料轉換成json物件
		var formData = $('#searchForm').serializeJSON();
//		alert(JSON.stringify(formData));
//		$('#grid').datagrid('load',formData);
		//alert(JSON.stringify($('#grid').datagrid('getData')));
		//把json物件轉換成字串
		/* alert(JSON.stringify(formData));*/
	 	$.ajax({
			url: 'dep_listBySerch',
			data: formData,
			dataType: 'json',
			type: 'post',
			success:function(rtn){
				//grid載入資料
				//datagrid(引數1,引數2)
				//引數1 =》 datagrid裡的方法名稱
				//引數2 =》 datagrid裡的方法所需要的引數
				$('#grid').datagrid('loadData',rtn);
				//
			//	total = rtn.length;
			//	{total: total, rows:rtn};
			}
		});  
	});
	
	$('#editDlg').dialog({    
	    title: '部門編輯',    
	    width: 300,
	    height: 200,
	    closed: true,//視窗是是否為關閉狀態, true:表示關閉    
	    modal: true//模式視窗
	});   
	
	$('#btnSave').bind('click',function(){
		var formData = $('#editForm').serializeJSON();
		$.ajax({
			url: 'dep_' + method,
			data: formData,
			dataType: 'json',
			type: 'post',
			success:function(rtn){
/* 				$.messager.alert("提示",rtn,'info',function(){
					//成功的話,我們要關閉視窗                                              title:在頭部面板顯示的標題文字。
					$('#editDlg').dialog('close');         msg:顯示的訊息文字。
					//重新整理表格資料                                                                       icon:顯示的圖示影象。可用值有:error,question,info,warning。
					$('#grid').datagrid('reload');          fn: 在視窗關閉的時候觸發該回調函式。
				}); */
				if(rtn){
					$.messager.alert('提示','操作成功','info');    

				}else{
					$.messager.alert('提示','操作失敗','error');   
				}
				$('#editDlg').dialog('close');
				//重新整理表格資料
				$('#grid').datagrid('reload');
			}
		});
	});

});


/**
 * 刪除部門
 */
function del(id){
	$.messager.confirm("確認","確認要刪除嗎?",function(yes){
		if(yes){
			$.ajax({
				url: 'dep_delete?id=' + id,
				dataType: 'json',
				type: 'post',
				success:function(rtn){
					if(rtn){
						$.messager.alert("提示","刪除成功",'info',function(){
							//重新整理表格資料
							$('#grid').datagrid('reload');
						});
					}else{
						$.messager.alert("提示","刪除失敗",'error',function(){
							//重新整理表格資料
							$('#grid').datagrid('reload');
						});
					}
				}
			});
		}
	});
}

/**
 * 修改部門
 */
function edit(id){
	//彈出視窗
	$('#editDlg').dialog('open');
	
	//清空表單內容
	$('#editForm').form('clear');
	
	method = "update";
	//載入資料
	$('#editForm').form('load','dep_getById?id=' + id);
}
</script>
</head>
<body>
<div class="easyui-panel" style="padding-left:4px;border-bottom:0px;">
<div style="height:2px;"></div>
<form id="searchForm">
	<table>
		<tr>
			<td>部門名稱</td>
			<td><input name="dep.name"></td>
		</tr>
		<tr>
			<td>部門電話</td>
			<td><input name="dep.tele"></td>
		</tr>
	</table>
	<button id="btnSearch" type="button">查詢</button>
</form>
<div style="height:2px;"></div>
</div>
	
<table id="grid"></table>

<div id="editDlg">
	<form id="editForm">
		<table>
			<tr>
				<td>部門名稱</td>
				<td><input name="dep.name"><input type="hidden" name="dep.id" /></td>
			</tr>
			<tr>
				<td>部門電話</td>
				<td><input name="dep.tele"></td>
			</tr>
		</table>
		<button id="btnSave" type="button">儲存</button>
	</form>
</div>
</body>
</html>

action

package action;

import java.io.IOException;
import java.util.HashMap;
import java.util.List;
import java.util.Map;

import javax.servlet.http.HttpServletResponse;
import org.apache.struts2.ServletActionContext;

import com.alibaba.fastjson.JSON;
import com.opensymphony.xwork2.ActionSupport;

import entity.Dep;
import service.IDepBiz;

public class DepAction extends ActionSupport {

	private static final long serialVersionUID = 1L;
	private IDepBiz depBiz;
	private Dep dep;
	private boolean flag;
	private String id;
	private int page;//頁碼
	private int rows;//行數 每頁行數
	



	/**
	 * 部門列表
	 */
	public void list(){
		int firstData = (page - 1) * rows;
		List<Dep> dlist = depBiz.getList(firstData,rows);
		int num =  depBiz.getCount();
		Map map = new HashMap<String,Object>();
		map.put("total", num);
		map.put("rows", dlist);
		String jsonString = JSON.toJSONString(map);
		HttpServletResponse response = ServletActionContext.getResponse();
		try {
			//response.setCharacterEncoding("UTF-8");
			response.setContentType("text/html;charset=utf-8"); 
			response.getWriter().print(jsonString);
		} catch (Exception e) {
			// TODO Auto-generated catch block
			e.printStackTrace();
		}
	}
	/**
	 * 部門列表--條件查詢
	 */
	public void listBySerch(){
		int firstData = (page - 1) * rows;
		List<Dep> dlist = depBiz.getList(dep,firstData,rows);
		int num =  depBiz.getCount();
		Map map = new HashMap<String,Object>();
		map.put("total", num);
		map.put("rows", dlist);
		String jsonString = JSON.toJSONString(map);
		HttpServletResponse response = ServletActionContext.getResponse();
		try {
			//response.setCharacterEncoding("UTF-8");
			response.setContentType("text/html;charset=utf-8"); 
			response.getWriter().print(jsonString);
		} catch (Exception e) {
			// TODO Auto-generated catch block
			e.printStackTrace();
		}
	}
	public void update(){
		flag = depBiz.update(dep);
		try {
			HttpServletResponse response = ServletActionContext.getResponse();
			response.setContentType("text/html;charset=utf-8");
			response.getWriter().print(flag);
		} catch (IOException e) {
			// TODO Auto-generated catch block
			e.printStackTrace();
		}
	}
	
	/**
	 * 查詢出的物件直接轉換json:{"id":38,"name":"公關部","tele":"444444"}
	 * 這種格式表單無法載入,需要拼接成{"dep.id":38,"dep.name":"公關部","dep.tele":"444444"}
	 * 
	 */
	public void getById(){
		Dep depby = depBiz.getById(id);
		String jsonString = JSON.toJSONString(depby);
		String fixString = fixString(jsonString,"dep");
		try {
			HttpServletResponse response = ServletActionContext.getResponse();
			response.setContentType("text/html;charset=utf-8");
			response.getWriter().print(fixString);
		} catch (IOException e) {
			// TODO Auto-generated catch block
			e.printStackTrace();
		}
	}
	public String fixString(String jsonMap ,String prefix ){
		Map <String ,Object>  map = JSON.parseObject(jsonMap);
		Map<String,Object> mapp = new HashMap<>();
		for (String key : map.keySet()) {
			mapp.put(prefix+"."+key, map.get(key));
		}
		return JSON.toJSONString(mapp);
	}
	
	/**
	 * 新增部門
	 */
	public void add(){
		flag = depBiz.add(dep);
		HttpServletResponse response = ServletActionContext.getResponse();
		try {
			response.setContentType("text/html;charset=utf-8"); 
			response.getWriter().print(flag);
		} catch (Exception e) {
			// TODO Auto-generated catch block
			e.printStackTrace();
		}
	}
	
	/**
	 * 部門刪除
	 * @return
	 */
	public void delete(){
		flag = depBiz.delete(id);
		HttpServletResponse response = ServletActionContext.getResponse();
		try {
			response.setContentType("text/html;charset=utf-8"); 
			response.getWriter().print(flag);
		} catch (Exception e) {
			// TODO Auto-generated catch block
			e.printStackTrace();
		}
	}
	
	
	public IDepBiz getDepBiz() {
		return depBiz;
	}

	public void setDepBiz(IDepBiz depBiz) {
		this.depBiz = depBiz;
	}
	
	public Dep getDep() {
		return dep;
	}

	public void setDep(Dep dep) {
		this.dep = dep;
	}

	public boolean isFlag() {
		return flag;
	}

	public void setFlag(boolean flag) {
		this.flag = flag;
	}

	public String getId() {
		return id;
	}

	public void setId(String id) {
		this.id = id;
	}

	public int getPage() {
		return page;
	}
	public void setPage(int page) {
		this.page = page;
	}
	public int getRows() {
		return rows;
	}
	public void setRows(int rows) {
		this.rows = rows;
	}
}

struts.xml

<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE struts PUBLIC
	"-//Apache Software Foundation//DTD Struts Configuration 2.3//EN"
	"http://struts.apache.org/dtds/struts-2.3.dtd">
<struts>
    <package name="default" namespace="/" extends="struts-default">    
    	<!-- 部門管理 -->
    	<action name="dep_*" class="action.DepAction" method="{1}"></action>	   	
    </package>
</struts>