easyui04

一. 建包

 二、因为要取servlet执行,所以要用Iframe框架

onDblClick : function(node) {
    //判重,如果为false即可以添加新的tab
    if(!$("#tt").tabs('exists',node.text)){
    $('#tt').tabs('add', {
        title:node.text,
        //将内容更改为iframe框架,跳转到servlet处理
        content:'<iframe frameborder=0 src="' 
            + node.url 
            + '" scrolling="no" style="width:100%;height:100%;"></iframe>',    
        closable:true
    });
    //如果为true,证明已经存在,就移动到指定的tab
    }else{
        $('#tt').tabs('select',node.text)
    }
}

三、HTML代码

<%@ 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 type="text/javascript">
    $(function(){
        $('#dg').datagrid({    
            //进servlet拿到数据
            url:ctx+'/BookServlet',
            toolbar: '#tb',
            //显示底部分页工具栏
            pagination:true,
            columns:[[    
                //表格的结构,需要与实体类保持一致
                {field:'id',title:'ID',width:100},    
                {field:'bookname',title:'书本名称',width:100},    
                {field:'price',title:'价格',width:100},
                {field:'booktype',title:'类型',width:100} 
            ]]    
        });
        //模糊查询
        $("#qrybtn").click(function(){
            qry();
        });
        
        function qry(){
            //使用重载的方法将查询的内容传递到servlet中
            $('#dg').datagrid("reload",{
                bookName:$("#bookName").val()
            });
        }
    })
</script>
</head>
<body>
<form action="" method="post" style="margin-top:20px">
    <div>   
        <label for="name">书名:</label>   
        <input id="bookName" class="easyui-textbox" style="width:300px"> 
        <a id="qrybtn" href="#" class="easyui-linkbutton" data-options="iconCls:'icon-search'">查询</a>
    </div>
    <div style="margin-top:20px" style="text-align:center">
        <table id="dg"></table>
    </div>
    <div id="tb" style="text-align:right">
        <a href="#" class="easyui-linkbutton" data-options="iconCls:'icon-add',plain:true"></a>
        <a href="#" class="easyui-linkbutton" data-options="iconCls:'icon-edit',plain:true"></a>
        <a href="#" class="easyui-linkbutton" data-options="iconCls:'icon-remove',plain:true"></a>
    </div>
</form> 
</body>
</html> 

四、接口定义方法

public interface IBookDao{

        分页

        public List<Book> getBooks(String name, int pageIndex, int pageSize);

        拿到总记录数

        public int getTotalPage();

}

五、重写接口方法

public class BookDao implements IBookDao {
 
    @Override
    public List<Book> getBooks(String name, int pageIndex, int pageSize) {
        Connection con = null;
        PreparedStatement ps = null;
        ResultSet rs = null;
        
        List<Book> list = new ArrayList<>();
        
        try {
            String sql = "select id,bookname,price,booktype,rownum as rid from t_book";
            if(name != null && !"".equals(name)) {
                sql += " where bookname like ?";
            }
            
            sql = "select * from (" + sql + ")b where b.rid between ? and ?";
            
            con = DBHelper.getsCon();
            ps = con.prepareStatement(sql);
            
            int start =(pageIndex-1)*pageSize+1;
            int end = pageIndex*pageSize;
            
            if(name != null && !"".equals(name)) {
                ps.setString(1, "%"+name+"%");
                ps.setInt(2, start);
                ps.setInt(3, end);
            } else {
                ps.setInt(1, start);
                ps.setInt(2, end);
            }
            
            rs = ps.executeQuery();
            
            while(rs.next()) {
                Book m = new Book();
                m.setId(rs.getInt("id"));
                m.setBookname(rs.getString("bookname"));
                m.setPrice(rs.getBigDecimal("price"));
                m.setBooktype(rs.getString("booktype"));
                list.add(m);
            }
            
        } catch (Exception e) {
            e.printStackTrace();
        } finally {
            DBHelper.Close(con, ps, rs);
        }
        
        return list;
    }
    
    
    @Override
    public int getTotalPage() {
        Connection con = null;
        PreparedStatement ps = null;
        ResultSet rs = null;
        
        int n  = 0;
        try {
            con= DBHelper.getsCon();
            String sql = "select count(*) from  t_book";
            ps = con.prepareStatement(sql);
            rs= ps.executeQuery();
            if(rs.next()) {
                n = rs.getInt(1);
            }
            
        } catch (Exception e) {
            e.printStackTrace();
        }finally {
            DBHelper.Close(con, ps, rs);
        }
        return n;
    }
 

六、servlet 开发

@WebServlet("/BookServlet")
public class BookServlet extends HttpServlet{
    
    private IBookService service = new BookService();
    
    @Override
    protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
        doPost(req, resp);
    }
    
     @Override
    protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
         //设置字符编码
         req.setCharacterEncoding("utf-8");
            resp.setContentType("application/json; charset=utf-8");
            
            String name = req.getParameter("bookName");
            String pageIndex = req.getParameter("page");
            int pid = pageIndex == null || "".equals(pageIndex) ?  1 : Integer.parseInt(pageIndex);
            int pageSize = 10;
            
            List<Book> list = service.getBooks(name, pid, pageSize);
            int totalPage = service.getTotalPage();
            
            Map<String,Object> data = new HashMap<>();
            data.put("total", totalPage);
            data.put("rows", list);
            
            String json = JSON.toJSONString(data);
            
            PrintWriter out = resp.getWriter();
            out.write(json);
            out.flush();
            out.close();
    }
}

七、页面展示

 

 

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值