码迷,mamicode.com
首页 > 其他好文 > 详细

(四)网格(dataGrid)

时间:2017-10-20 18:20:26      阅读:138      评论:0      收藏:0      [点我收藏+]

标签:doc   long   dbutil   img   str   system   pack   round   oid   

一、普通网格

  • 前端index.jsp
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html >
<html>
<%
    String path = request.getContextPath();
%>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<link rel="stylesheet" type="text/css"
    href="<%=path%>/script/easyUI-1.4/themes/bootstrap/easyui.css">
<link rel="stylesheet" type="text/css"
    href="<%=path%>/script/easyUI-1.4/themes/icon.css">
<script type="text/javascript"
    src="<%=path%>/script/easyUI-1.4/jquery-1.8.3.min.js"></script>
<script type="text/javascript"
    src="<%=path%>/script/easyUI-1.4/jquery.easyui.min.js"></script>
<script type="text/javascript"
    src="<%=path%>/script/easyUI-1.4/locale/easyui-lang-zh_CN.js"></script>
</head>

<script type="text/javascript">
    jQuery(function() {
        $(#dg).datagrid({
            url:"<%=path%>/servlet/getDataGrid",
            method : "POST",
            //定义网格的标题
            title : "普通网格",
            width : 450,

            columns : [ [
            //定义列,这里有三列,每一列的都是一个对象,title为列标题,field为字段的名称
            {
                title : "第一列列名",
                field : "id",
                width : 150
            }, {
                title : "第二列列名",
                field : "userName",
                width : 150
            }, {
                title : "第三列列名",
                field : "passWord",
                width : 150
            } ] ]

        });
    });
</script>

<body>
    <pre>
    1.普通的网格
    <table id="dg"></table>  
</pre>
</body>
</html>
  • 后台从数据库中获取数据并封装为json格式的字符串响应回前台。
package servlet;

import java.io.IOException;
import java.io.PrintWriter;
import java.sql.Connection;
import java.sql.ResultSet;
import java.sql.Statement;
import java.util.ArrayList;
import java.util.HashMap;
import java.util.List;
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.google.gson.Gson;

import util.DBUtil;

/**
 * Servlet implementation class GetDataGridServlet
 */
@WebServlet("/servlet/getDataGrid")
public class GetDataGridServlet extends HttpServlet {
    private static final long serialVersionUID = 1L;

    /**
     * @see HttpServlet#doGet(HttpServletRequest request, HttpServletResponse
     *      response)
     */
    protected void doGet(HttpServletRequest request, HttpServletResponse response)
            throws ServletException, IOException {
        this.doPost(request, response);
    }

    /**
     * @see HttpServlet#doPost(HttpServletRequest request, HttpServletResponse
     *      response)
     */
    protected void doPost(HttpServletRequest request, HttpServletResponse response)
            throws ServletException, IOException {

        request.setCharacterEncoding("UTF-8");
        response.setCharacterEncoding("UTF-8");
        response.setContentType("text/html");
        PrintWriter out = response.getWriter();
        Connection conn = null;
        Statement stat = null;
        ResultSet rs = null;
        String sql = "";
        try {
            conn = DBUtil.getConn();
            sql = "select * from users";
            stat = conn.createStatement();

            rs = stat.executeQuery(sql);
            List<Map<String, String>> gridDataList = new ArrayList<Map<String, String>>();
            Map<String,Object> gridDataMap=new HashMap<String,Object>();
            Map<String, String> columnMap = null;
            while (rs.next()) {

                String id = (String.valueOf(rs.getInt("id")));
                String userName = rs.getString("userName");
                String passWord = rs.getString("passWord");

                columnMap = new HashMap<String, String>();
                columnMap.put("id", id);
                columnMap.put("userName", userName);
                columnMap.put("passWord", passWord);
                gridDataList.add(columnMap);
            }
            gridDataMap.put("total", gridDataList.size());
            gridDataMap.put("rows", gridDataList);
            Gson gson=new Gson();
            String str_gridData=gson.toJson(gridDataMap);
            System.out.println(str_gridData);
            out.print(str_gridData);
            
        } catch (Exception e) {
            e.printStackTrace();
        }
        out.flush();
        out.close();
    }

}

 

结果:

技术分享

 

 二、分页网格

 

(四)网格(dataGrid)

标签:doc   long   dbutil   img   str   system   pack   round   oid   

原文地址:http://www.cnblogs.com/shyroke/p/7700210.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!