使用EasyUI实现修改删除功能
目录
前言:
这次的功能是基于上一次的项目做的,如果有不懂的可以看上一节使用EasyUI实现增加功能
一:前台开发
二:后台开发
三:效果图
距离使用EasyUI完成整个后台、书本管理项目只剩这最后一次讲解了,话不多说,直接上代码
一.前台开发
同样,修改和删除在原来的基础上有所延伸,找到原来的页面继续写就行了
bookList.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>Insert title here</title>
<%@include file="../../common/head.jsp" %>
<script>$(function(){$('#dg').datagrid({ url:ctx+'/BookServlet', toolbar: '#tb',pagination:true, //显示底部分页工具栏singleSelect:true,//只能选择一行columns:[[ //表格的结构,需要与实体类保持一致{field:'id',title:'ID',width:100,align:'center'}, {field:'bookname',title:'书本名称',width:100,align:'center'}, {field:'price',title:'价格',width:100,align:'center'},{field:'booktype',title:'类型',width:100,align:'center'} ]] }); //给查询添加点击事件$("#qrybtn").click(function(){qry();});function qry(){//重载行$('#dg').datagrid("reload",{//拿到以前的值给文本框赋值bookName:$("#bookName").val()});};//增加书本$("#addBook").click(function() {openDialog();});//修改书本$("#updateBook").click(function(){let row = $('#dg').datagrid("getSelected");openDialog(row);});//删除书本$("#deleteBook").click(function(){let row = $('#dg').datagrid("getSelected");if(!row){$.messager.alert('提示', '请先选择你要删除的书籍');return;}let id=row.id;$.messager.confirm('确认','您确认想要删除记录吗?',function(r){ if (r){ $.ajax({url:ctx + "/bookDeleteServlet",type:'post',data: {id:id},dataType:'json',success:function(resp){if(resp.success){$.messager.alert('提示', '操作成功');qry();}else{$.messager.alert('警告', '操作失败');}}});} }); })function openDialog(row){let title="增加书本信息";let action = "/bookAddServlet";if(row){title = "修改书本信息";action = "/bookUpdateServlet";}$("#editDlalog").dialog({ title:title, width: 300, height: 250, closed: false, cache: false, href: 'editBook.jsp', modal: true,buttons:[{text:'保存',iconCls:'icon-save',handler:function(){$.ajax({url:ctx + action,type:'post',data: $("#bookForm").serialize(),dataType:'json',success:function(resp){if(resp.success){$.messager.alert('提示', '操作成功');$("#editDlalog").dialog("close");qry();}else{$.messager.alert('警告', '操作失败');}}});}},{text:'关闭',iconCls:'icon-cancel',handler:function(){$("#editDlalog").dialog("close");}}],onLoad: function() {if(row) {$("#bookForm").form("reset");//重置$("#bookForm").form("load", row);//加载数据}}}); }});
</script>
</head>
<body>
<form style="margin-top:20px;"><label for="name">书籍名称:</label> <input id="bookName" class="easyui-textbox" data-options="" style="width:300px;"><a id="qrybtn" href="#" class="easyui-linkbutton" data-options="iconCls:'icon-search'">查询</a>
</form><div style="margin-top:10px;"><table id="dg"></table>
</div><!-- 列表上方的工具条 -->
<div id="tb" style="text-align:right;"><a href="#" id="addBook" class="easyui-linkbutton" data-options="iconCls:'icon-add',plain:true"></a><a href="#" id="updateBook" class="easyui-linkbutton" data-options="iconCls:'icon-edit',plain:true"></a><a href="#" id="deleteBook" class="easyui-linkbutton" data-options="iconCls:'icon-remove',plain:true"></a>
</div><!-- 给弹出窗口定义一个容器,并默认为隐藏,在点击后再显示 -->
<div id="editDlalog" style="display:none;"></div>
</body>
</html>
editBook.jsp
<%@ page language="java" contentType="text/html; charset=UTF-8"pageEncoding="UTF-8"%>
<form id="bookForm"><input type="hidden" name="id" id="id"/><div style="margin-top: 10px;margin-left:10px;"> <label for="name">书本名称:</label> <input class="easyui-textbox" type="text" name="bookname" id="bookname" data-options="required:true" /> </div> <div style="margin-top: 10px;margin-left:10px;"> <label for="price">书本价格:</label> <input class="easyui-textbox" type="text" name="price" id="price" data-options="required:true" /> </div><div style="margin-top: 10px;margin-left:10px;"> <label for="booktype">书本类型:</label> <input class="easyui-textbox" type="text" name="booktype" id="booktype" data-options="required:true" /> </div>
</form>
二:后台开发
IBookDao 实现一个接口
/*** 修改书本* @param book 书本对象*/void updateBook(Book book);/*** 删除书本* @param id 书本id*/void delBook(Integer id);
BookDao
@Overridepublic void updateBook(Book book) {Connection con = null;PreparedStatement ps = null;String sql = "update t_book set bookname=?,price=?, booktype=? where id=?";try {con = DBHelper.getCon();ps = con.prepareStatement(sql);ps.setString(1, book.getBookname());ps.setBigDecimal(2, book.getPrice());ps.setString(3, book.getBooktype());ps.setInt(4, book.getId());ps.executeUpdate();} catch (Exception e) {e.printStackTrace();} finally {DBHelper.myClose(con, ps, null);}}@Overridepublic void delBook(Integer id) {Connection con = null;PreparedStatement ps = null;String sql = "delete from t_book where id=?";try {con = DBHelper.getCon();ps = con.prepareStatement(sql);ps.setInt(1, id);ps.executeUpdate();} catch (Exception e) {e.printStackTrace();} finally {DBHelper.myClose(con, ps, null);}}
IBookService
/*** 修改书本* @param book 书本对象*/void updateBook(Book book);/*** 删除书本* @param id 书本id*/void delBook(Integer id);
BookService
@Overridepublic void updateBook(Book book) {// TODO Auto-generated method stubbd.updateBook(book);}@Overridepublic void delBook(Integer id) {// TODO Auto-generated method stubbd.delBook(id);}
BookUpdateServlet
package com.zking.euidemo.servlet;import java.io.IOException;import java.io.PrintWriter;
import java.math.BigDecimal;
import java.util.HashMap;
import java.util.Map;import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;import com.alibaba.fastjson.JSON;
import com.zking.euidemo.entity.Book;
import com.zking.euidemo.service.BookService;
import com.zking.euidemo.service.IBookService;
@WebServlet("/bookUpdateServlet")
public class BookUpdateServlet extends HttpServlet{private IBookService service= new BookService();@Overrideprotected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {doPost(req, resp);}@Overrideprotected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {//设置字符编码方式req.setCharacterEncoding("utf-8");resp.setContentType("application/json; charset=utf-8");Map<String, Object> rv = new HashMap<>();try {String id =req.getParameter("id");String bookname = req.getParameter("bookname");String price = req.getParameter("price");String booktype = req.getParameter("booktype");Book book = new Book();book.setId(Integer.parseInt(id));book.setBookname(bookname);book.setPrice(new BigDecimal(price));book.setBooktype(booktype);service.updateBook(book);rv.put("success", true);} catch (Exception e) {e.printStackTrace();rv.put("success", false);}PrintWriter out = resp.getWriter();String json=JSON.toJSONString(rv);out.write(json);out.flush();out.close();}
}
BookDeleteServlet
package com.zking.euidemo.servlet;import java.io.IOException;
import java.io.PrintWriter;
import java.util.HashMap;
import java.util.Map;import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;import com.alibaba.fastjson.JSON;
import com.zking.euidemo.service.BookService;
import com.zking.euidemo.service.IBookService;
@WebServlet("/bookDeleteServlet")
public class BookDeleteServlet extends HttpServlet{private IBookService service = new BookService();@Overrideprotected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {doPost(req, resp);}@Overrideprotected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {//设置字符编码方式req.setCharacterEncoding("utf-8");resp.setContentType("application/json; charset=utf-8");Map<String, Object> rv = new HashMap<>();try {String id = req.getParameter("id");service.delBook(Integer.parseInt(id));rv.put("success", true);} catch (Exception e) {e.printStackTrace();rv.put("success", false);}PrintWriter out = resp.getWriter();String json = JSON.toJSONString(rv);out.write(json);out.flush();out.close();}
}
三:效果图
注: 当没有选中你要修改的记录去点击修改按钮时默认弹出增加界面,当选中了你要修改的行时点击修改按钮是会传入一个id弹出修改界面,界面上绑定了该书本的信息,修改成功时会弹出操作成功的提示窗口。
注:当用户没有选中要删除的记录时点击删除按钮,会弹出提示窗口提示“请先选择你要删除的书籍”;当用户选中要删除的记录时点击删除按钮则传入一个书籍id并提示用户是否要删除,如果用户选择“确定”则提示删除成功,如果用户选择“取消”则返回书籍展示界面。
好了,整个使用EasyUI完成整个后台、书本管理的项目完成了,希望能对大家有所帮助!!!
使用EasyUI实现修改删除功能相关推荐
- 6、图书类别修改删除功能
实现图书类别修改功能 1.添加修改的Dao方法 /*** 图书类别Dao类* @author Administrator**/ public class BookTypeDao {/*** 图书类别添 ...
- 9、图书修改,删除功能
1.添加图书修改,删除的Dao代码 /*** 图书Dao类* @author Administrator**/ public class BookDao {/*** 图书添加* @param con* ...
- 基于IO流读取的 完成 用户登录,注册,修改,查看所有用户,删除功能
Controller import java.util.Scanner;/*** 视图层* 完成用户登录,注册,修改,删除功能*/ public class Controller {/*** 字符输入 ...
- JdbcTemplate(操作数据库-修改和删除功能)
目录 JdbcTemplate(操作数据库-删除功能) 1.创建数据库 2.配置文件实现 3.创建实体类 4.创建dao层 5.创建service层 6.测试类 7.测试结果: JdbcTemplat ...
- Spring5框架基础详解(五)(JdbcTemplate概念和准备、jdbcTemplate操作数据库添加功能、修改和删除功能、查询功能)
文章目录 一.JdbcTemplate是什么和准备工作 1.1.引入相关maven依赖 1.2在spring配置文件配置数据库连接 1.3配置JdbcTemplate对象,注入DateSource 1 ...
- BOS项目(SSH)04_02_修改密码功能-easyui的表单验证、表单检验 easyUI实现表单验证、如果加密的密码忘记了怎么办
系列文章目录 文章目录 系列文章目录 前言 修改密码功能-easyui的表单检验 如果加密的密码忘记了怎么办 总结 前言 这些是easyUI帮我们做好的,我们只需要在easyUI里面声明好一些属性即可 ...
- c语言 增加 删除 修改的功能 不用链表,不用链表,单是结构体写入文件后,是否可以进行修改删除...
不用链表,单是结构体写入文件后,是否可以进行修改删除 #include #include #include typedef struct Node { char num[20]; char name ...
- EasyUI(修改删除)
目录 一.创建数据库 二.创建包结构 三.更改主页结构 四.页面搭建 五.dao层开发 六.Service层开发 七.Servlet开发 八.运行效果 一.创建数据库 二.创建包结构 三.更改主页结构 ...
- CentOS7设置静态IP、搭建单机版FastDFS图片服务器、使用FastDFS-Client客户端进行简单测试、实现图片上传、实现商品添加修改删除
CentOS7设置静态IP.搭建单机版FastDFS图片服务器.使用FastDFS-Client客户端进行简单测试.实现图片上传.实现商品添加修改删除 CentOS7设置静态IP而且还可以上网 192 ...
最新文章
- 还在苦恼机器学习和线性回归?这篇总结拿走不谢 | 原力计划
- 不要再封装各种Util工具类了,这个神级框架值得拥有!
- 大数据驱动的运营创新和探索
- Unity插件-NGUI使用教程
- java struts2 安全漏洞 devMode 简介
- 高考数学经典题(001)
- java实验楼使用说明_Java 方法
- Ajax基石脚本异步并发调用参数传递
- Html中锚点的使用【转】
- PPA 软件源 ppa:ondrej/php 在哪里找到的
- matlab 不确定度计算器,不确定度计算器
- android微信表情导出来的,微信表情怎么导出 如何批量备份微信表情
- ⼤数据可视化技术:可视化技术概述与Echarts⼊⻔
- 单片机C语言LED点阵编程,单片机LED点阵的介绍
- 当前读和快照读的区别
- 闪电贷攻击攻击屡试不爽,DeFi一周被盗超1600万美元
- MVC 音乐商店 第 5 部分: 编辑窗体和模板化
- Qt模拟键盘按键与组合键
- CentOS6 安装Tomcat7
- 华为linux输入法,华为手机输入法设置
热门文章
- 【C语言循环结构题目】幻影素数
- 有哪些免费好用的在线视频编辑工具?
- 阿里云服务器+MobaXtern+Anaconda
- C#: 解决Fody is only supported on MSBuild 16 and above
- SQL2005,错误 0xc00470fe 数据流任务 产品级别对于 组件“源 - 2009_txt”(1) 而言不足
- OA协同办公系统,赋能企业智慧未来
- 信创操作系统--麒麟Kylin桌面版 (项目七 网络连接:有线、无线网络)
- java做一个万年历和闹钟,数字电子钟毕业设计源程序(加万年历和闹钟功能)...
- python提取文件_Python文件读取常用方法
- 百万年薪python之路 -- MySQL数据库之 完整性约束