Easyui05和Easyui06

Easyui05

dao方法

bookAddServlet

bookList.jsp

 

editbook.jsp

效果图 

点击右上角的+号时弹出   

 

增加成功时弹出 

 Easyui06

实现书籍信息的修改和删除

修改书本信息

dao方法

@Override
	public void updateBook(Book book) {
		Connection con = null;
		PreparedStatement ps = null;
		
		String sql = "update t_book set bookname=?, price=?,booktype=? where id=?" ;
		
		
		try {
			con = DBHelper.getsCon();
			ps = con.prepareStatement(sql);
			ps.setString(1, book.getBookname());
			ps.setFloat(2, Float.parseFloat(book.getPrice()));
			ps.setString(3, book.getBooktype());
			ps.setInt(4, book.getId());
			
			ps.executeUpdate();
		} catch (SQLException e) {
			e.printStackTrace();
		} finally {
			DBHelper.Close(con, ps);
		}
	}

BookUpdateServlet

package com.zking.easyuitest.servlet;

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

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.easyuitest.model.Book;
import com.zking.easyuitest.service.BookService;
import com.zking.easyuitest.service.IBookService;

@WebServlet("/bookUpdateServlet")
public class BookUpdateServlet extends HttpServlet {
	
	private IBookService service = new BookService();
	
	public void doGet(HttpServletRequest req, HttpServletResponse resp) throws IOException {
		doPost(req, resp);
	}
	
	public void doPost(HttpServletRequest req, HttpServletResponse resp) throws IOException {
		
		req.setCharacterEncoding("utf-8");
		resp.setContentType("application/json; charset=utf-8"); 
		
		Map<String,Object> map = new HashMap<>();
		try {
			Book book = new Book();
			book.setId(Integer.parseInt(req.getParameter("id")));
			book.setBookname(req.getParameter("bookname"));
			book.setPrice(req.getParameter("price"));
			book.setBooktype(req.getParameter("booktype"));
			service.updateBook(book);
			map.put("success", true);
			
		} catch (Exception e) {
			e.printStackTrace();
			map.put("success", false);
		}
		
		PrintWriter out = resp.getWriter();
		out.write(JSON.toJSONString(map));
		out.flush();
		out.close();
	}

}

bookList.jsp

function openDialog(row) {
		
		let title = "增加书本信息";
		let action = "/bookAddServlet"
		if(row) {
			title = "修改书本信息";
			action = "/bookUpdateServlet"
		}
		
		$('#bookDiglog').dialog({    
		    title: title,    
		    width: 400,    
		    height: 250,    
		    closed: false,    
		    cache: false,    
		    href: 'editbook.jsp',    
		    modal: true,
		    buttons:[{
				text:'保存',
				handler:function(){
					$.ajax({
						url:ctx + action,
						data: $("#bookForm").serialize(),
						type: 'post',
						dataType: 'JSON',
						success: function(resp) {
							
							if(resp.success) {
								$.messager.alert('消息','操作成功');
								$('#bookDiglog').dialog('close');
								qryBook();
							} else {
								$.messager.alert('警告','操作失败');    
							}
						}
					});
				}
			},{
				text:'关闭',
				handler:function(){
					$('#bookDiglog').dialog('close');
				}
			}],
			
			onLoad: function() {
				if(row) {
					$("#bookForm").form("reset");
			    	$("#bookForm").form("load", row);
				}
			}
		});
	}
});

editBook.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<div>
	<form id="bookForm">   
		<input type="hidden" name="id" id="id"/>
	    <div style="margin: 15px;">   
	        <label for="name">书名:</label>   
	        <input class="easyui-textbox" name="bookname"  style="width:300px" data-options="required:true"> 
	    </div>   
	    <div style="margin: 15px;">   
	        <label for="price">价格:</label>   
	        <input class="easyui-textbox" name="price"  style="width:300px" data-options="required:true"> 
	    </div>
	    <div style="margin: 15px;">   
	        <label for="booktype">类型:</label>   
	        <input class="easyui-textbox" name="booktype" style="width:300px" data-options="required:true"> 
	    </div>  
	</form>
</div>

效果图 

 删除书本

dao方法

@Override
	public void delBook(int id) {
		Connection con = null;
		PreparedStatement ps = null;
		
		String sql = "delete t_book where id=?" ;
		
		
		try {
			con = DBHelper.getsCon();
			ps = con.prepareStatement(sql);
			
			ps.setInt(1, id);
			
			ps.executeUpdate();
		} catch (SQLException e) {
			e.printStackTrace();
		} finally {
			DBHelper.Close(con, ps);
		}
	}

BookDelServlet

package com.zking.easyuitest.servlet;

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

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.easyuitest.model.Book;
import com.zking.easyuitest.service.BookService;
import com.zking.easyuitest.service.IBookService;

@WebServlet("/bookDelServlet")
public class BookDelServlet extends HttpServlet {
	
private IBookService service = new BookService();
	
	public void doGet(HttpServletRequest req, HttpServletResponse resp) throws IOException {
		doPost(req, resp);
	}
	
	public void doPost(HttpServletRequest req, HttpServletResponse resp) throws IOException {
		
		req.setCharacterEncoding("utf-8");
		resp.setContentType("application/json; charset=utf-8"); 
		
		Map<String,Object> map = new HashMap<>();
		try {
			int id = Integer.parseInt(req.getParameter("id"));
			service.delBookByID(id);
			map.put("success", true);
			
		} catch (Exception e) {
			e.printStackTrace();
			map.put("success", false);
		}
		
		PrintWriter out = resp.getWriter();
		out.write(JSON.toJSONString(map));
		out.flush();
		out.close();
	}

}

bookList.jsp 

$("#delBootBtn").click(function() {
		let row = $("#bookTable").datagrid("getSelected");
		
		if(!row) {
			$.messager.alert('消息','请选择要删除的记录');
			return;
		}
		
		$.ajax({
			url: ctx + '/bookDelServlet',
			type: 'post',
			data:{
				id: row.id
			},
			dataType: 'json',
			success: function(resp) {
				if(resp.success) {
					$.messager.alert('消息','操作成功');
					qryBook();
				}else{
					$.messager.alert('消息','操作不成功');
				}
			}
		})
	})

editBook.jsp

​
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<div>
	<form id="bookForm">   
		<input type="hidden" name="id" id="id"/>
	    <div style="margin: 15px;">   
	        <label for="name">书名:</label>   
	        <input class="easyui-textbox" name="bookname"  style="width:300px" data-options="required:true"> 
	    </div>   
	    <div style="margin: 15px;">   
	        <label for="price">价格:</label>   
	        <input class="easyui-textbox" name="price"  style="width:300px" data-options="required:true"> 
	    </div>
	    <div style="margin: 15px;">   
	        <label for="booktype">类型:</label>   
	        <input class="easyui-textbox" name="booktype" style="width:300px" data-options="required:true"> 
	    </div>  
	</form>
</div>

​

效果图：