转自:https://blog.csdn.net/l3922768721/article/details/51597977

导入js和css

<%@ page language="java" contentType="text/html;  charset=UTF-8" pageEncoding="UTF-8"%>

<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>

 <c:set var="ctx" value="${pageContext.request.contextPath}" />

<meta charset="UTF-8">

<META HTTP-EQUIV="Pragma" CONTENT="no-cache">

<META HTTP-EQUIV="Cache-Control" CONTENT="no-cache">

<META HTTP-EQUIV="Expires" CONTENT="0">

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

<meta http-equiv="X-UA-Compatible" content="IE=Edge" />

<meta name="viewport"

content="width=device-width, initial-scale=1, maximum-scale=1">

<link rel="stylesheet" type="text/css" href="${ctx}/css/dtree.css">

<script type="text/javascript" src="${ctx}/js/easyui/jquery-1.6.min.js"></script>

<script type="text/javascript" src="${ctx}/js/easyui/jquery.easyui.min.js"></script>

<script type="text/javascript" src="${ctx}/js/easyui/jquery.edatagrid.js"></script>

<link rel="stylesheet" href="${ctx}/css/easyui/demo.css" type="text/css">

<link rel="stylesheet" href="${ctx}/css/easyui/easyui.css" type="text/css">

<link rel="stylesheet" href="${ctx}/css/easyui/icon.css" type="text/css">

<script src="${ctx}/js/dtree.js" type="text/javascript"></script>

jsp

<html>

<head>

    <base href="${ctx}">

    <title>用户信息</title>

    <script type="text/javascript">

            var jsondata='{"total":1,"rows":[{"username":"001","password":"001"},{"username":"002","password":"002"},{"username":"002","password":"002"}]}';

            var data = $.parseJSON(jsondata); //json格式化

            $(document).ready(function(){

                $("#dg").datagrid({

                title: "用户信息列表",

                width: 700,

                height: 'auto',

                striped: true,

                rownumbers: true,

                singleSelect: true,

                nowrap: true,

                pagination: true,

                columns:[[

                {field:"username",title:"用户名",width:100},

                {field:"password",title:"密码",width:100}

                   ]]

            })

           $("#dg").datagrid('loadData', data);//加载数据，不加表格数据不会显示

    });

</script>

</head>

  <body>

    <table id="dg"></table>

  </body>

</html>

jsp+easyui+DataGrid 例子的更多相关文章

  1. EasyUI Datagrid的简单使用

    此前同样写过EasyUI Datagrid的demo,好记性不如烂笔头,何况记性也不是那么好,赶紧记录一下.照搬上一篇EasyUI Tree的格式. 实现效果:获取数据库表的数据,在EasyUI Da ...

  2. easyui datagrid中 多表头方法总结

    easyui datagrid中怎么设置表头成多行显示呢?其实很简单,就是给datagrid的columns属性设置成多个数组就行了.下面直接看例子吧,这是一个两行表头的,按照此方法,还可以设置三行表 ...

  3. 动态设置easyui datagrid URL

    动态设置easyui datagrid URL$('#tt').datagrid({url:'website/jsp/servlet',        queryParams:{method:'xx' ...

  4. EasyUI datagrid简单运用

    jquery的前端框架挺多的,有easyUI ,bootstrap...,对于做系统软件或许easyUI比较好,因为里面控件很丰富,而bootstrap非常简洁大方,但是控件相 对比较少,特别是复杂的 ...

  5. easyui datagrid load 封装 参数问题 js 作用域

    var temp = { LoginAccount: $('#LoginAccount').val(), ShopName: $('#ShopName').val() }; function doSe ...

  6. 扩展jquery easyui datagrid编辑单元格

    扩展jquery easyui datagrid编辑单元格 1.随便聊聊 这段时间由于工作上的业务需求,对jquery easyui比较感兴趣,根据比较浅薄的js知识,对jquery easyui中的 ...

  7. EasyUI Datagrid 鼠标悬停显示单元格内容 复制代码

    EasyUI Datagrid 鼠标悬停显示单元格内容 ,halign:, align: 0 « 上一篇:LINQ to Entities 中的查询» 下一篇:去掉字符串中的非数字字符 posted ...

  8. 一步步实现 easyui datagrid表格宽度自适应，效果非常好

    一步步实现 easyui datagrid表格宽度自适应,效果非常好: 一.设置公共方法,使得datagrid的属性  fitColumns:true $(function(){ //初始加载,表格宽 ...

  9. DataTables VS EasyUI DataGrid 基础应用 转

    DataTables中文网推出了 第一篇 关于DataTables和其他表格插件比较后,为了把让这个比较更有意义,更能帮助到大家,DataTables中文网 做了问卷调查,根据小伙伴们的填写我归纳了一 ...

随机推荐

  1. RV ItemDecoration 分割线 简介 MD

    Markdown版本笔记 我的GitHub首页 我的博客 我的微信 我的邮箱 MyAndroidBlogs baiqiantao baiqiantao bqt20094 baiqiantao@sina ...

  2. Hadoop家族学习路线、实践案例

    作者:Han Hsiao链接:https://www.zhihu.com/question/19795366/answer/24524910来源:知乎著作权归作者所有.商业转载请联系作者获得授权,非商 ...

  3. NSURLSession下载

    ios7引入了NSURLSession,通过它可以支持后台相关的网络操作的新特性: 1. 后台上传下载: 2.不需要通过nsoperation,直接用nsurlsession的api就可以做到网络操作 ...

  4. RNN(Recurrent Neural Networks)公式推导和实现

    RNN(Recurrent Neural Networks)公式推导和实现 http://x-algo.cn/index.php/2016/04/25/rnn-recurrent-neural-net ...

  5. 微信小程序 this.data与this.setData

    一.摘要 小程序中我们会经常使用到this.data与this.setData.其中this.data是用来获取页面data对象的,而this.setData是用来更新界面的.那么他们之间的区别与联系 ...

  6. [转]学习块格式化上下文（BlockFormattingContext）

    原文:https://www.cnblogs.com/elcarim5efil/p/4745796.html   格式化上下文 格式化上下文( formatting contexts )├── 块级格 ...

  7. Kafka：ZK+Kafka+Spark Streaming集群环境搭建（二十七）：kafka manager安装

    一.kafka-manager简介 为了简化开发者和服务工程师维护Kafka集群的工作,yahoo构建了一个叫做Kafka管理器的基于Web工具,叫做 Kafka Manager.这个管理工具可以很容 ...

  8. IIS中的application总是报404错误

      在IIS的一个站点下面建立了一个application,访问其中页面的时候总是报404(找不到页面)的错误,哪怕是最简单只包含一个简单html页面的application也是如此,而其他同级的ap ...

  9. Struts2的Action继承ActionSupport时,利用AOP来拦截Action出现NoSuchMethodException

    参考:http://zhanghua.1199.blog.163.com/blog/static/46449807201111139501298/ 做项目的时候,由于要用到在Struts2的Actio ...

  10. 企业防火墙之iptables

    1.1 企业中安全优化配置原则 尽可能不给服务器配置外网ip ,可以通过代理转发或者通过防火墙映射.并发不是特别大情况有外网ip,可以开启防火墙服务. 大并发的情况,不能开iptables,影响性能, ...