jQuery EasyUI快速入门06

目录

实现图书的删除/修改

 一、图书的删除

1、在工具栏的减号图标上添加id

2、编写删除的方法

3、编写servlet

4、设立点击事件

​

二、图书修改

1、在工具栏的修改图标上添加id

2、编写修改的方法

3、编写servlet

4、设立点击事件

---

实现图书的删除/修改  一、图书的删除 1、在工具栏的减号图标上添加id

2、编写删除的方法

@Override
public void delBooks(int bid) {
	Connection conn = null;
	PreparedStatement ps = null;
	String sql = "delete from tb_book where bid = "+ bid;
	try {
		//获取连接
		conn = DBHelper.getConn();
		//传入执行对象
		ps = conn.prepareStatement(sql);
		//返回所影响的行数
		ps.executeUpdate();
	} catch (Exception e) {
		e.printStackTrace();
	}finally {
		DBHelper.myClose(conn, ps, null);
	}
}

3、编写servlet

protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
		//设置编码
		request.setCharacterEncoding("utf-8");
		response.setCharacterEncoding("utf-8");
		response.setContentType("application/json;charset=utf-8");
		//通过request获取前端传递过来的图书编号
		Integer bid = request.getParameter("bid")!=null?Integer.valueOf(request.getParameter("bid")):0;
		//实例化业务逻辑层
		IBooksBiz ibb = new BooksBizImpl();
		//Map集合
		Map maps = new HashMap();
		//调用删除的方法
		try {
			ibb.delBooks(bid);
			maps.put("message", true);
		} catch (Exception e) {
			maps.put("message", false);
		}
		//JSON工具
		ObjectMapper mapper = new ObjectMapper();
		String writeValueAsString = mapper.writeValueAsString(maps);
		//out对象
		PrintWriter out = response.getWriter();
		out.write(writeValueAsString);
		out.flush();
		out.close();
	}
}

4、设立点击事件

属性名	属性值类型	描述	默认值
singleSelect	boolean	如果为true，则只允许选择一行。	false

为表格设立singSelect，只允许点击一行

           //删除的点击事件
			$("#delBookId").click(function(){
				//alert(123);
				//1.获取选中的行  getSelected方法  获取是否选中行
				let row = $('#bookListID').datagrid("getSelected");
				//console.log(row);
				//判断  没有选中  无 *** 作
				if(!row){//空  没有选中
					$.messager.alert('信息',"请选中行再 *** 作");
					return;
				}
				//动用jQuery提供的ajax方法  id丢过去   id   row.bid
				//DelBook.do
				$.post(xPath+"/DelBook.do",{"bid":row.bid},function(data){
					if(data.message){
						$.messager.alert('信息',"删除成功");
						//重新加载
						mydemo();
					}
				});
			});
			})

 

二、图书修改 1、在工具栏的修改图标上添加id

2、编写修改的方法

@Override
public void editBooks(int bid, Books book) {
	Connection conn = null;
	PreparedStatement ps = null;
	String sql = "update tb_book set bname = ? , bprice = ? , btype = ? where bid = "+bid;
	try {
		//获取连接
		conn = DBHelper.getConn();
		//传入执行对象
		ps = conn.prepareStatement(sql);
		//占位符赋值
		ps.setString(1, book.getBname());
		ps.setFloat(2, book.getBprice());
		ps.setString(3, book.getBtype());
		//返回所影响的行数
		ps.executeUpdate();
	} catch (Exception e) {
		e.printStackTrace();
	}finally {
		DBHelper.myClose(conn, ps, null);
	}	
}

3、编写servlet

protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
		//不考虑模糊查询
		request.setCharacterEncoding("utf-8");
		response.setCharacterEncoding("utf-8");
		response.setContentType("application/json;charset=utf-8");
		//实例化biz
		IBooksBiz ibb = new BooksBizImpl();
		//id
		Integer bid = request.getParameter("bid")!=null?Integer.valueOf(request.getParameter("bid")):0;
		String bname = request.getParameter("bname");
		Float bprice = Float.valueOf(request.getParameter("bprice"));
		String btype = request.getParameter("btype");
		Books book = new Books(bname, bprice, btype);
		ObjectMapper mapper = new ObjectMapper();
		Map maps = new HashMap();
		//判断book是否修改成功
		try {
			ibb.editBooks(bid,book);
			maps.put("success", true);
		} catch (Exception e) {
			maps.put("success", false);
		}
		String writeValueAsString = mapper.writeValueAsString(maps);
		PrintWriter out = response.getWriter();
		out.write(writeValueAsString);
		out.flush();
		out.close();		
	}

4、设立点击事件

             修改和增加共用一个对话框窗口，利用方法保存再判断，显示不同的标题，传入不同的servlet中，最后进行显示。

//修改图书的点击事件
			$("#editBookId").click(function(){
				//alert(123)
				let row = $('#bookListID').datagrid("getSelected");
				getData('edit',row);
			});
			//由于新增图书和修改图书的d出Dialog共用    封装
			function getData(type,row){
				let myTitle = '书籍新增';
				let action = "/AddBooks.do"
				if(type === 'add'){
					myTitle = '书籍新增'
				}else if(type === 'edit'){
					myTitle = '书籍编辑';
					action = "/editBook.do"
				}	
				$('#dd').dialog({    
				    title: myTitle,    
				    width: 400,    
				    height: 255,    
				    closed: false,    
				    cache: false,    
				    href: xPath+'/addBook.jsp',    
				    modal: true,
				    buttons:[{
						text:'保存',
						handler:function(){
							//alert("保存");
							//获取表单中的数据，调用方法  传递到servlet中
							$.ajax({
								url:xPath+action,
								//参数传递：jQuery的选择器传递  jQuery方法
								data:$("#bookForm").serialize(),
								datatype:"JSON",
								success:function(data){
									if(data.success){
										$.messager.alert('消息',' *** 作成功');
										//关闭窗口
										$("#dd").dialog('close');
										//重新加载
										mydemo();
									}
								}
							});
						}
					},{
						text:'关闭',
						handler:function(){
							//alert("关闭");
							//调用的方法dialog   参数方法close来源于panel
							$("#dd").dialog('close');
						}
					}],
					//点击按钮d出Dialog窗口是触发的加载事件
					onLoad: function() {
						if(row) {
							$("#bookForm").form("reset");
							$('#bookForm').form('load',row);
						}
					}
				});