Strust2 + Layui 实现CURD

Struts2与Layui实现CRUD
最新推荐文章于 2025-06-12 08:04:17 发布
原创 最新推荐文章于 2025-06-12 08:04:17 发布 · 1k 阅读 · 0 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
文章标签：

#strust2

本文介绍如何使用Struts2框架配合Layui前端库实现基本的增删查改(CRUD)功能，包括后端Dao类、Action类的编写，以及前端页面的布局与交互。

数据库

在这里插入图片描述

Dao类

/**
 *StrutsClassDao
 * @author 20190313
 *
 */
public class StrutsClassDao extends JsonBaseDao{
	
	/**
	 *查询
	 * @param paMap
	 * @param pageBean
	 * @return
	 * @throws Exception
	 */
	public List<Map<String, Object>> query(Map<String, String[]> paMap, PageBean pageBean) throws Exception {
		String sql = "select * from t_struts_class where true ";
		String cname = JsonUtils.getParamVal(paMap, "cname");
		// 是否带名称查询
		if (StringUtils.isNotBlank(cname)) {
			sql = sql + " and cname  like '%" + cname + "%'";
		}
		String cid = JsonUtils.getParamVal(paMap, "cid");
		// 带id查询
		if (StringUtils.isNotBlank(cid)) {
			sql = sql + " and cid  = " + cid ;
		}
		
		return super.executeQuery(sql, pageBean);
	}
	
	
	
	
	/**
	 *修改
	 * 
	 * @param paMap
	 * @return
	 * @throws Exception
	 */
	public int eidt(Map<String, String[]> paMap) throws Exception {
		String sql = "update t_struts_class set cname = ?, cteacher = ?, pic = ? where cid = ?";
		return super.executeUpdate(sql, new String[] {"cname", "cteacher", "pic", "cid"}, paMap);
	}

	
	
	/**
	 *删除
	 * @param paMap
	 * @return
	 * @throws Exception
	 */
	public int remove(Map<String, String[]> paMap) throws Exception {
		// ����������sql���
		String sql = "delete from t_struts_class where cid = ?";
		// ִ�з����� ʹ�õ���Map��ѯ�ķ���
		return super.executeUpdate(sql, new String[] { "cid" }, paMap);
	}
	
	

	/**
	 * 添加
	 * 
	 * @param paMap
	 * @return
	 * @throws Exception
	 */
	public int add(Map<String, String[]> paMap) throws Exception {
		String sql = "insert into t_struts_class (cname, cteacher, pic)values (?,?,?)";
		return super.executeUpdate(sql, new String[] { "cname", "cteacher", "pic"}, paMap);
	}
	
	
	
	
}

curd请求的Action类

/**
 * 这是curl请求aciton
 * @author 20190313
 *
 */
public class StrutsClassAction extends BaseAction{
	private StrutsClassDao strutsClassDao = new StrutsClassDao();
	
	
	/**
	 * 添加
	 * @return
	 * @throws Exception 
	 */
	public  String add() throws Exception {
		int n = strutsClassDao.add(request.getParameterMap());
		ResponseUtil.writeJSON(response, n);
		return null;
	}
	
	/**
	 * 查询
	 * @return
	 * @throws Exception 
	 */
	public  String query() throws Exception {
		PageBean pageBean = new PageBean();
		pageBean.setRequest(request);
		
		List<Map<String, Object>> list  = strutsClassDao.query(request.getParameterMap(), pageBean);
		Map<String, Object> map=new HashMap<>();
		map.put("code", 0);
		map.put("count", pageBean.getTotal());
		map.put("data", list);
		//以JSON格式返回
		ResponseUtil.writeJSON(response, map);
		return null;
	}
	
	
	
	/**
	 *修改
	 * @return
	 * @throws Exception 
	 */
	public  String eidt() throws Exception {
		int n = strutsClassDao.eidt(request.getParameterMap());
		ResponseUtil.writeJSON(response, n);
		return null;
	}
	
	
	
	/**
	 * 删除
	 * @return
	 * @throws Exception 
	 */
	public  String remove() throws Exception {
		int n = strutsClassDao.remove(request.getParameterMap());
		ResponseUtil.writeJSON(response, n);
		return null;
	}
	
	
	
}

strust2的配置文件中添加如下代码

	<package name="sy" extends="base" namespace="/sy">
		<action name="/strutsClassAction_*" class="com.cpc.web.StrutsClassAction" method="{1}">
		</action>
	</package>

前台JSP页面

<%@ 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>Layui + Struts 实现CURD</title>
<!-- 引入layui的css包 -->
<link rel="stylesheet" href="static/layui/css/layui.css">
<!-- 引入layui的js包 -->
<script src="${pageContext.request.contextPath }/static/layui/layui.js"></script>
<!-- 引入jquery-->
<script type="text/javascript" src="static/js/jquery-3.3.1.js"></script>
</head>
<body class="child-body">

	<!--隐藏域传值  -->
	<input type="hidden" id="path"
		value="${pageContext.request.contextPath}">
		
	<blockquote class="layui-elem-quote">
		<!--搜索框-->
		<div class="layui-form">
			<div class="layui-form-item">
				<label class="layui-form-label">cname:</label>
				<div class="layui-input-inline">
					<input type="text" id='searchName' name="searchName"
						lay-verify="required" placeholder="请输入cname" autocomplete="true"
						class="layui-input">
				</div>
				<button class="layui-btn layui-btn-normal layui-btn-radius"
					data-type="reload">
					<i class="layui-icon">&#xe615;</i>查询
				</button>
				<button class="layui-btn layui-btn-normal" data-type="add">新建</button>
			</div>
		</div>
	</blockquote>

	<!--根据table id 来展示表格数据  -->
	<table class="layui-hide" id="strutsClassTable" lay-filter="test"></table>
	
	<!--行内样式按钮   -->
	<script type="text/html" id="lineBtns">
  		<a class="layui-btn layui-btn-xs" lay-event="edit"><i class="layui-icon">&#xe642;</i>编辑</a>
 		<a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
	</script>
	
	
	<!--弹出层  增改通用-->
	 <div class="site-text" style="margin: 5%; display: none" id="box1"  target="test123">
	    <form class="layui-form layui-form-pane" onsubmit="return false" id="myFrom">
	        <div class="layui-form-item">
	            <label class="layui-form-label"> cname</label>
	            <div class="layui-input-block">
	                <input type="text" class="layui-input"  id="cname"  name=cname><br>
	            </div>
	            
	              <label class="layui-form-label">cteacher</label>
	            <div class="layui-input-block">
	                <input type="text" class="layui-input"  id="cteacher"  name=cteacher><br>
	            </div>
	               <label class="layui-form-label">pic</label>
	            <div class="layui-input-block">
	                <input type="text" class="layui-input"  id="pic"  name=pic><br>
	            </div>
	        </div>
	    </form>
	</div> 

	<!-- 引入当前页面的js -->
	<script src="${pageContext.request.contextPath }/static/js/index.js"></script>
</body>
</html>

index.js

//执行渲染
layui.use(['table','layer','form'],function(){
	//定义通用全局变量
	var path=document.getElementById("path").value;
	var table =layui.table;
	var layer=layui.layer;
	var form = layui.form;
    var $ = layui.$;
	
    //展示数据表格（数据表格初始化）
	table.render({
		 elem:'#strutsClassTable'//表格id
		,url:path+'/sy/strutsClassAction_query.action'//所对应调用的接口
		,method:'post'		//提交方式
	    ,cols:[[
	    	/*根据数据库的表格所对应的名称  */
	         {field:'cid',height:80, width:300, title: 'cid'}
	         ,{field:'cname', height:80,width:300, title: 'cname'}
	         ,{field:'cteacher',height:80, width:300, title: 'cteacher'}
	         ,{field:'pic',height:80, width:300, title: 'pic'}
	         ,{field:'right',height:80, width:300, title: '操作', toolbar:'#lineBtns'}//操作栏
	    ]]
	    ,page:'true'//分页
	    , id: 'testReload'
	});
	
	
    
    //查询和新增事件触发
    var active = {
            //查询
            reload: function () {
                var cname = $('#searchName').val();//获取查询内容
                // 执行重载
                table.reload('testReload', {
                    page: {
                        curr: 1// 从第1页开始展示查询结果
                    },
                    where: {
                        key: 'cname',
                        cname: cname
                    }
                });
            }, 
            add: function () { //添加
                layer.open({//弹出框
                    type: 1,
                    title: '添加信息',
                    maxmin: true,
                    shadeClose: true, //点击遮罩关闭层
                    area: ['60%', '55%'],
                    content: $('#box1'),
                    btn: ['确定', '取消'],
                    //当点击确定触发回掉
                    yes: function (index, layero) {//确定执行函数
                        //通过向后台返回ajax请求来添加数据
                        $.getJSON(path+"/sy/strutsClassAction_add.action", {
                        	//携带参数
                        	cname:$("#cname").val(),
                        	cteacher:$("#cteacher").val(),
                        	pic:$("#pic").val()
                        }, function (data) {
                        	/*根据后台返回的参数来进行判断是否添加成功 */
                            if (data >  0) {
                            	//弹出提示层
                                layer.alert('添加成功', {icon: 1, title: '提示'}, function (i) {
                                    layer.close(i);
                                    layer.close(index);//关闭弹出层
                                    $("#myFrom")[0].reset()//重置form
                                })
                                //重载表格
                                table.reload('testReload', {
                                    page: {
                                        curr: 1// 重新从第 1 页开始
                                    }
                                })
                            } else{
                            	//提示添加失败
                                layer.msg('添加失败')
                            }
                        })

                    }, cancel: function (index, layero) {//取消
                    	//当点击取消按钮
                        $("#myFrom")[0].reset()//重置form  根据id
                        layer.close(index)
                    }
                });
            }
    }
    
    //这是事件的通用触发
    $('.layui-form .layui-btn').on('click', function () {
        var type = $(this).data('type');
        active[type] ? active[type].call(this) : '';
    });
	
	
	
	/*表格 行内操作(编辑  以及  删除 按钮操作)  */
	table.on('tool(test)', function(obj){
	         var data = obj.data; //获得当前行数据
	         var tr=obj.tr//活动当前行tr 的  DOM对象
	         var layEvent = obj.event; //获取操作状态 修改和删除
	         
	         if(layEvent === 'del'){ //删除
	             layer.confirm('确定删除吗？',{title:'删除'}, function(index){
	                 //向服务端发送删除指令og
	                 $.getJSON(path+'/sy/strutsClassAction_remove.action',{cid:data.cid}, function(ret){
	                         layer.close(index);//关闭弹窗
	                         table.reload('testReload', {//重载表格
	                             page: {
	                                 curr: 1// 重新从第 1 页开始
	                             }
	                         })
	                 });
	                 layer.close(index);
	             });
	         } else if(layEvent === 'edit'){ //编辑
	             layer.open({
	            	 type: 1,
	                 title: '修改信息',
	                 maxmin: true,
	                 shadeClose: true, //点击遮罩关闭层
	                 area: ['60%', '55%'],
	                 content: $('#box1'),
	                 btn: ['确定', '取消']
	                 ,content:$('#box1')  //弹窗id
	                 ,success:function(layero,index){
	                	 //数据绑定
		                 $('#cname').val(data.cname);
		                 $('#cteacher').val(data.cteacher);
		                 $("#pic").val(data.pic);
	                 },yes:function(index,layero){
	                	//确定修改回掉
	                	  $.getJSON(path+'/sy/strutsClassAction_eidt.action',{
	                			//携带参数
	                        	cname:$("#cname").val(),
	                        	cteacher:$("#cteacher").val(),
	                        	pic:$("#pic").val(),
	                        	cid:data.cid
	                	  },function(data){
	                	  //根据后台返回的参数，来进行判断
	                		  if(data>0){
	                			  layer.alert('编辑成功',{icon:1,title:'提示'},function(i){
	                				  layer.close(i);
	                                  layer.close(index);//关闭弹出层
	                                  $("#myFrom")[0].reset()//重置form
	                			  })
	                			  table.reload('testReload',{//重载表格
	                				  page:{
	                					  curr:1
	                				  }
	                			  })
	                		  }
	                	  });
	                 }
	               
	             
	             });
	         }
	    });  
});

展示效果

在这里插入图片描述

qq_43059674
关注
Struts2结合layui完成的增删查改
Zhangrunhong的博客
06-30 1399
文章目录1、导入相关的pom依赖，引入layui（struts、自定义标签库的依赖）2、完成web.xml的配置3、dao层去访问数据4、web层去调用dao层给前台返回数据5、在struts_sy.xml进行配置6、写jsp7.js界面 前言：利用Struts2结合layui完成的增删查改可以节省代码量是界面更美观 以下我分了7步给大家讲解一下 1、导入相关的pom依赖，引入layui（stru...
Layui实现CURD
LIN_17970的博客
07-10 457
Layui实现CURDBookdao方法BookActionstrust2的配置文件index.jsindex.jsp Bookdao方法 package com.dao; import java.sql.SQLException; import java.util.List; import com.entity.Book; import com.sun.javafx.collections....
CURD
小铭的命名空间
11-14 487
CURD是一个数据库技术中的缩写词，一般的项目开发的各种参数的基本功能都是CURD。 　　它代表创建（Create）、更新（Update）、读取（Read）和删除（Delete）操作。 　　CURD 定义了用于处理数据的基本原子操作。. 　　之所以将CURD 提升到一个技术难题的高度是因为完成一个涉及在多个数据库系统中进行CRUD操作的汇总相关的活动，其性能可能会随数据关系的变化
MybatisPlus Pro 来了，CURD开发效率直接拉满~
最新发布
码农code之路
06-12 108
具体来说，该类中包含了五个基本HTTP操作（POST, GET），通过不同参数和请求方式对实体对象进行CRUD操作，即添加(insert)、删除(delete)、修改(update)、查询(getById)、存储(save)、列表查询(list)、分页查询(page)、统计数量(count)。作为开发的时候，虽然好用，但是大多数都在对dao层面的增删改查，所以打算自己抽取一套在controller层的功能出来，先介绍一下，“类，就可以拥有增删改查，查询列表，分页查询，排序，带参数查询，统计数量。
layui的table实现 Struts2+layui
qq_43224049的博客
11-26 1616
table表格其实还是很好实现的，先看效果吧 前台界面的代码如下： &lt;body&gt; &lt;input type="hidden" id="sd" value="${pageContext.request.contextPath}"&gt; &lt;form id="" class="layui-form" action="&quot
Struts2+hibernate4+layui+mysql简单的网站后台管理系统
12-30
Struts2+hibernate4+layui+mysql简单的网站后台管理系统 项目描述 简单的网站后台管理系统 运行环境 jdk7+tomcat7+mysql+myeclipse 项目技术(必填) struts2+hibernate4+layui+jquery+jstl 数据库文件 src根目录下struts.sql jar包文件 链接: https://pan.baidu.com/s/1qNkWrWmAk44sh8JHZE1RIw 密码: wt5n
Struts2+Spring+IBatis实现CURD
12-12
在Java Web开发中，"Struts2+Spring+IBatis"是一个常见的企业级应用框架组合，也被称为SSI（Struts2、Spring、iBatis）框架。这种组合提供了模型-视图-控制器（MVC）架构，事务管理，以及灵活的数据访问机制。以下是...
Java项目:问卷调查系统(java+SSM+layui+JSP+Mysql)
06-24
项目介绍 这是一个基于SpringMVC+Spring+MyBatis的SSM...2. 前端：JSP+css+javascript+jQuery+layui 使用说明 1. 使用Navicat或者其它工具，在mysql中创建对应名称的数据库，并导入项目的sql文件； 2.使用IDEA/Ecl
struts2+spring+ibaites+oracle+CURD
07-31
在与 Struts2 集成时，Spring 可以作为服务层，管理 Struts2 动作类的依赖，提供数据访问对象（DAO）和业务服务接口的实现。 3. **iBatis**： iBatis 是一个 SQL 映射框架，它允许开发者编写 SQL 而不是使用 ORM...
深入解析Struts2+Spring+Ibatis+Oracle实现CURD
标题：“struts2+spring+ibaites+oracle+CURD”是一个结合了多个成熟技术框架的组合，专门用于开发Web应用程序中的数据增删改查（Create, Update, Read, Delete，简称CURD）操作。这些技术框架包括： - Struts2：是...
CURD是什么
热门推荐
语博兄的专栏
06-03 1万+
CURD是一个数据库技术中的缩写词，一般的项目开发的各种参数的基本功能都是CURD。它代表创建（Create）、更新（Update）、读取（Read）和删除（Delete）操作。CURD 定义了用于处理数据的基本原子操作。.之所以将CURD 提升到一个技术难题的高度是因为完成一个涉及在多个数据库系统中进行CRUD操作的汇总相关的活动，其性能可能会随数据关系的变化而有非常大的差异。CURD 操作通常
Mybatis简单的CURD
qq_46379459的博客
08-03 197
简单说明使用感觉 Mybatis的使用不像javaEE那边的Servlet那样和数据库链接要写很多请求try，catch,还要关闭连接，反反复复的判断，就算是一写代码可以复用也得写好多。而Mybatis使用方便，在配置文件中连接完数据就可以使用起来，语法也相对轻松许多。 连接数据库的配置文件 # 应用名称 spring.application.name=demo #数 据 源 配 置 spring.datasource.url=jdbc:mysql://localhost:3306/数据库名?charac
Yii (CURD）
大家的blog
12-18 322
1、ActiveRecord 类型的增删改查 以\app\models\Article 模型为准 ， 来操作以下函数 1) 查询数据 ①findAll 查询多条数据 \app\models\Article::findAll([‘status’ => ‘1’]); //查询 Article , status 为 1 的所有数据 ②根据 findOne 进行查询 ， 根式\app\mo...
Java 的Curd
上下求索
07-23 1823
在Struts 2中实现CRUD CRUD是Create（创建）、Read（读取）、Update（更新）和Delete（删除）的缩写，它是普通应用程序的缩影。如果您掌握了某框架的CRUD编写，那么意味可以使用该框架创建普通应用程序了，所以大家使用新框架开发OLTP（Online Transaction Processing）应用程序时，首先会研究一下如何编写CRUD。这类似于大家在学习新编程语言时...
CURD 是什么
烧烤电影香烟和啤酒
12-19 8110
它代表创建（Create）、更新（Update）、读取（Retrieve）和删除（Delete）操作。
评论 2
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值