本文共 13024 字，大约阅读时间需要 43 分钟。

1.创建项目搭好框架及需要的包-类

2.StudentDao

package com.zking.test.dao;import java.sql.Connection;import java.sql.PreparedStatement;import java.sql.ResultSet;import java.sql.SQLException;import java.util.ArrayList;import java.util.List;import com.zking.test.entity.Student;import com.zking.test.util.DBAccess;import com.zking.test.util.PageBean;import com.zking.test.util.StringUtils;public class StudentDao extends BaseDAO
   
     {Connection conn = null;PreparedStatement stmt = null;ResultSet rs = null;public void addStu(Student student) {	if(StringUtils.isBlank(student.getId())) {		String maxid = maxId();		student.setId(maxid);	}	String sql="INSERT INTO student(sid,sname,sage,ssex)VALUES(?,?,?,?)";	try {		conn = DBAccess.getConnection();		stmt = conn.prepareCall(sql);		stmt.setString(1, student.getId());		stmt.setString(2, student.getSname());		stmt.setDate(3, student.getSage());		stmt.setString(4, student.getSsex());		stmt.executeUpdate();	} catch (Exception e) {		throw new RuntimeException(e);	}finally {		DBAccess.close(conn, stmt, rs);	}}public void updeStu(Student student) {	String sql="update student set sname=?,sage=?,ssex=? where sid=?";	try {		conn = DBAccess.getConnection();		stmt = conn.prepareCall(sql);		stmt.setString(1, student.getSname());		stmt.setDate(2, student.getSage());		stmt.setString(3, student.getSsex());		stmt.setString(4, student.getId());		stmt.executeUpdate();	} catch (Exception e) {		throw new RuntimeException(e);	}finally {		DBAccess.close(conn, stmt, rs);	}	}public void deleStu(Student student) {	String sql="delete from student where sid=?";	try {		conn = DBAccess.getConnection();		stmt = conn.prepareCall(sql);		stmt.setString(1, student.getId());		stmt.executeUpdate();	} catch (Exception e) {		throw new RuntimeException(e);	}finally {		DBAccess.close(conn, stmt, rs);	}}public Student Student(Student student) {	Student s=null;		String sql="select * from  student where sid=?";	try {		conn = DBAccess.getConnection();		stmt = conn.prepareCall(sql);		stmt.setString(1, student.getId());		rs = stmt.executeQuery();		if(rs.next()) {			s=new Student();			s.setId(rs.getString(1));			s.setSname(rs.getString(2));			s.setSage(rs.getDate(3));			s.setSsex(rs.getString(4));		}		return s;	} catch (Exception e) {		throw new RuntimeException(e);	}finally {		DBAccess.close(conn, stmt, rs);	}	}public List
    
      listStu(Student student,PageBean pageBean) {	String sql="select * from  student where 1=1";	if(StringUtils.isNotBlank(student.getSname())) {		sql+=" and sname like '%" + student.getSname().trim() + "%'";	}	sql+=" order by sid desc";//每次增加完新数据显示新数据（使用倒序）	return this.executeQuery(sql, pageBean, new Callback
     
      () {				@Override		public List
      
        foreach(ResultSet rs)				throws SQLException {			List
       
         list =new ArrayList
        
         (); Student s= null; while(rs.next()) { s=new Student(); s.setId(rs.getString("sid")); s.setSname(rs.getString("sname")); s.setSage(rs.getDate("sage")); s.setSsex(rs.getString("ssex")); list.add(s); } return list; } }); }public String maxId() { String id=""; try { conn=DBAccess.getConnection(); String sql="select max(sid+1) from student"; stmt=conn.prepareStatement(sql); rs=stmt.executeQuery(); if(rs.next()) { id=rs.getString(1); } } catch (Exception e) { throw new RuntimeException(e); }finally { DBAccess.close(conn, stmt, rs); } return id;}}
        
       
      
     
    
   

3.StudentAction extends（继承） DispatcgerAction implements（接口） ModelDriver的解释

package com.zking.test.action;import java.io.IOException;import java.io.PrintWriter;import java.sql.ResultSet;import java.sql.SQLException;import java.util.HashMap;import java.util.List;import java.util.Map;import javax.servlet.ServletException;import javax.servlet.http.HttpServletRequest;import javax.servlet.http.HttpServletResponse;import com.fasterxml.jackson.databind.ObjectMapper;import com.zking.mvc.framework.DispatcherAction;import com.zking.mvc.framework.ModelDriver;import com.zking.test.dao.StudentDao;import com.zking.test.dao.BaseDAO.Callback;import com.zking.test.entity.Student;import com.zking.test.util.PageBean;import com.zking.test.util.StringUtils;//解化参数public class StudentAction extends DispatcherAction implements ModelDriver
   
     {public Student student = new Student();public StudentDao studentdao = new StudentDao();public StudentAction() {}@Overridepublic Student getModel() {	return student;}public String dolist(HttpServletRequest req, HttpServletResponse resp)		throws ServletException, IOException {	//1.获取分页数据	PageBean pageBean = new PageBean();	//对pageBean初始化	//去pageBean方法取Page,Rows	pageBean.setRequest(req);		//2.根据查询条件得到查询出来的结果集	List
    
      liststu = studentdao.listStu(student, pageBean);	//3.通过Map对象来构建Json数据	Map
     
       map = new HashMap
      
       ();	map.put("total", pageBean.getTotal());//得到中记录数	map.put("rows", liststu);//（以前）页大小--（json）返回的结果集		//4.转换Map为json数据并发送给客户端	ObjectMapper mapper = new ObjectMapper();	String json = mapper.writeValueAsString(map);	//5.使用io流	PrintWriter out = resp.getWriter();	//输出到前端	out.println(json);		//一定要返回null，不然页面不能无刷新得不到json数据	return null;}public String doMeger(HttpServletRequest req, HttpServletResponse resp)		throws ServletException, IOException {	Integer code = 0;	String message = "";	if(StringUtils.isNotBlank(student.getId())) {//id不为空就是修改方法		studentdao.updeStu(student);		message = "学生修改成功";	}else {//增加方法		studentdao.addStu(student);		message = "学生增加成功";	}	Map
       
         data = new HashMap
        
         (); data.put("code", 0);//结果码 如果0为真 非0为假 data.put("message", message);//（以前）页大小-- （json）返回的结果集 ObjectMapper mapper = new ObjectMapper(); String json = mapper.writeValueAsString(data); //5.使用io流 PrintWriter out = resp.getWriter(); //输出到前端 out.println(json); return null;}public String doDelete(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException { studentdao.deleStu(student); Map
         
           map = new HashMap
          
           (); map.put("code", 0);//结果码 如果0为真 非0为假 map.put("message", "id为['"+student.getId()+"']的学生以被您删除");//（以前）页大小--（json）返回的结果集 ObjectMapper mapper = new ObjectMapper(); String json = mapper.writeValueAsString(map); //5.使用io流 PrintWriter out = resp.getWriter(); //输出到前端 out.println(json); return null;}}
          
         
        
       
      
     
    
   

4.配置config.xml- - -studentAction.action

5.使用postman进行测试opt值调用liststu方法

6.创建ListStudent.jsp

<%@ page language="java" contentType="text/html; charset=utf-8"    pageEncoding="utf-8"%><%@include file="/common/head.jsp"%>
   
         
      
   
    		姓名: 
    		
    查询		
    增加学生   
   
 

7.创建-WebContent/js/Liststu.js

$(function() {var url = ctx + "/studentAction.action?opt=dolist";$('#dg')		.datagrid(				{					// 表格单选					singleSelect : true,					// 设置为true时，选项卡的大小将铺满它所在的容器。					fit : true,					url : url,					columns : [ [							{								field : 'id',								title : '学号',								width : "20%",								align : 'center'							},							{								field : 'sname',								title : '姓名',								width : "20%",								align : 'center'							},							{								field : 'sage',								title : '年龄',								width : "20%",								align : 'center'							},							{								field : 'ssex',								title : '性别',								width : "20%",								align : 'center'							},							{								field : 'operate',								title : '操作',								width : "20%",								align : 'center',								formatter : function(value , row , index) {//										console.log(row);										var str = '';										str += ''										return str;									}								} ] ],						pagination : true,						pageSize : 20,						pageList : [ 10, 20, 50, 100 ],						toolbar : "#tb",						//datagrid加载成功事件						onLoadSuccess : function(data) {													$("a[name='update']").linkbutton({														text : '修改',														plain : true,														iconCls : 'icon-page-white-paintbrush'													}).click(function(){														var sid = $(this).data("sid");														if(sid){															 var row=$("#dg").datagrid("selectRecord",sid).datagrid("getSelected");															console.log(row);														}														$("#ff").form("load",row);														//修改dlg容器标题----然后打开容器														$('#dlg').dialog('setTitle',"修改").dialog("open"); 																										 												});												$("a[name='delete']").linkbutton({													text : '删除',													plain : true,//删除icon-bug-delete													iconCls : 'icon-bug-delete'												}).click(function(){													//获取当前列id													var id = $(this).data('sid');													$.messager.confirm("确认","您确认想要删除记录吗？",function(r){//异步对话框---做当前事情还能继续做别的事情													    if (r){    													    	var url = ctx+"/studentAction.action?opt=doDelete";													        $.ajax({													        	   type:"POST",													        	   url: url,													        	   id : id,													        	   dataType:"json",													        	   success: function(map){													        	     if(0==map.code){													        	    	 $.messager.alert("成功",map.message,"info");   													        	    	 doReload();													        	     }else{													        	    	 $.messager.alert("删除失败","暂时不能继续删除","question");   													        	     }													        	   }													        	});													    }    													});  												});											}				});// console.log('ok');// 新增学生$("#addBtn").click(function() {	$('#dlg').dialog('open');  	$('#dlg').dialog('open');  });// 新增学生$("#mergebtn").click(function() {	var url = ctx+"/studentAction.action?opt=doMeger";	var id = $("input[name='id']").val();	var dataStr = $("#ff").serialize();	$.ajax({		type:"post",		dataType:'json',		url:url,		data:dataStr,		success:function(data){			data = eval(data);			console.log(data);			if(0 == data.code){				$.messager.alert("消息",data.message,"info");				if(!id){//增加					$("#ff").form("clear");					doload();				}else{//修改					doReload();				}			}else{				$.messager.alert("错误","操作失误","error");			}		}			});  });// 查询$("#queryBtn").click(function() {	var sname = $("#name").val();	// 加载和显示第一页的所有行。如果指定了'param'，它将取代'queryParams'属性。通常可以通过传递一些参数执行一次查询，通过调用这个方法从服务器加载新数据。	doload({		// 发送给后台的姓名		sname : sname	});});//加载和显示第一页的行function doload(param){	$('#dg').datagrid('load', param);	console.log("doload.......");}//重载行。等同于'load'方法，但是它将保持在当前页。function doReload(param){	$('#dg').datagrid('reload', param);	console.log("doReload.......");}//删除function doDelete(pagam){	$('#dg').datagrid('reload', pagam);}//先给对话框初始化赋值onClose方法点击关闭清空文本框$('#dlg').dialog({	onClose: function(){		$("#ff").form("clear");	}});});

8.配置WebContent/common/head.jsp

<%@page import="java.io.PrintWriter"%><%@ page language="java" contentType="text/html; charset=utf-8"    pageEncoding="utf-8"%><% 	String ctx=request.getContextPath();	request.setAttribute("ctx", ctx);	out.println("");	%>		
   	
   	
   	
   

9.分页样式 转换中文字体WebContent/js/jquery-easyui-1.5.1/locale/easyui-lang-zh_CN.js

if ($.fn.pagination){	$.fn.pagination.defaults.beforePageText = '第';	$.fn.pagination.defaults.afterPageText = '共{pages}页';	$.fn.pagination.defaults.displayMsg = '显示{from}到{to},共{total}记录';}if ($.fn.datagrid){	$.fn.datagrid.defaults.loadMsg = '正在处理，请稍待。。。';}if ($.fn.treegrid && $.fn.datagrid){	$.fn.treegrid.defaults.loadMsg = $.fn.datagrid.defaults.loadMsg;}if ($.messager){	$.messager.defaults.ok = '确定';	$.messager.defaults.cancel = '取消';}$.map(['validatebox','textbox','passwordbox','filebox','searchbox',		'combo','combobox','combogrid','combotree',		'datebox','datetimebox','numberbox',		'spinner','numberspinner','timespinner','datetimespinner'], function(plugin){	if ($.fn[plugin]){		$.fn[plugin].defaults.missingMessage = '该输入项为必输项';	}});if ($.fn.validatebox){	$.fn.validatebox.defaults.rules.email.message = '请输入有效的电子邮件地址';	$.fn.validatebox.defaults.rules.url.message = '请输入有效的URL地址';	$.fn.validatebox.defaults.rules.length.message = '输入内容长度必须介于{0}和{1}之间';	$.fn.validatebox.defaults.rules.remote.message = '请修正该字段';}if ($.fn.calendar){	$.fn.calendar.defaults.weeks = ['日','一','二','三','四','五','六'];	$.fn.calendar.defaults.months = ['一月','二月','三月','四月','五月','六月','七月','八月','九月','十月','十一月','十二月'];}if ($.fn.datebox){	$.fn.datebox.defaults.currentText = '今天';	$.fn.datebox.defaults.closeText = '关闭';	$.fn.datebox.defaults.okText = '确定';	$.fn.datebox.defaults.formatter = function(date){		var y = date.getFullYear();		var m = date.getMonth()+1;		var d = date.getDate();		return y+'-'+(m<10?('0'+m):m)+'-'+(d<10?('0'+d):d);	};	$.fn.datebox.defaults.parser = function(s){		if (!s) return new Date();		var ss = s.split('-');		var y = parseInt(ss[0],10);		var m = parseInt(ss[1],10);		var d = parseInt(ss[2],10);		if (!isNaN(y) && !isNaN(m) && !isNaN(d)){			return new Date(y,m-1,d);		} else {			return new Date();		}	};}if ($.fn.datetimebox && $.fn.datebox){	$.extend($.fn.datetimebox.defaults,{		currentText: $.fn.datebox.defaults.currentText,		closeText: $.fn.datebox.defaults.closeText,		okText: $.fn.datebox.defaults.okText	});}if ($.fn.datetimespinner){	$.fn.datetimespinner.defaults.selections = [[0,4],[5,7],[8,10],[11,13],[14,16],[17,19]]}

10.完成所有动态前端数据表格功能

转载地址：https://blog.csdn.net/weixin_45067120/article/details/104565051 如侵犯您的版权，请留言回复原文章的地址，我们会给您删除此文章，给您带来不便请您谅解！