357029540
- 浏览: 741093 次
- 性别:
- 来自: 重庆
-
文章分类
- 全部博客 (173)
- JAVA (54)
- ORACLE (3)
- JAVASCRIPT (7)
- STRUCT2 (4)
- SPRING (12)
- EXTJS (7)
- JQUERY (4)
- SQLSERVER (10)
- IBATIS (1)
- MYSQL (6)
- JS (1)
- HTML5 (1)
- TOMCAT (3)
- JSP (1)
- HTML (1)
- 数据库 (2)
- HTTP (3)
- MAVEN (2)
- MyBatis (2)
- IDEA (1)
- spring boot (24)
- spring security (1)
- RestEasy (1)
- KAFKA (4)
- MongoDB (2)
- NODEJS (1)
- 非技术 (3)
- logback (1)
- DSL (1)
- thymeleaf (1)
- RedisTemplate (12)
- spring cloud (39)
- fastdfs (1)
- Disruptor (2)
- JAVAFX (1)
- exe4j (1)
- JVM (1)
- ZOOKEEPER (4)
- activiti (1)
- GRADLE (1)
- spring cloud config (7)
- poi (1)
- spring cloud eureka (7)
- Rabbit MQ (1)
- MQ (1)
- Centos (1)
- nifi (1)
- dubbo (1)
最新评论
-
yangganboy：
yangganboy 写道可以看我简书写的 java 运行时修 ...
java动态添加外部jar包到classpath -
yangganboy：
可以看我简书写的 java 运行时修改classpath 添加 ...
java动态添加外部jar包到classpath -
neufjava：
感谢您的分享！参考您的文章解决了困扰我一天的配置问题。再次感谢 ...
FastDFS文件系统的安装使用及代码的调用(单个节点) -
wo_niu：
写的非常
RedisTemplate常用集合使用说明-boundSetOps(九) -
wangyudong：
新版本 Wisdom RESTClienthttps://gi ...
部分介绍使用IDEA的rest client
在Extjs中生成表格的页面数据是Extjs提供的强大功能。在这里主要是做了一个简单的从后台通过structs2获取数据显示在页面的示例。json数据在后台是通过fastjson.jar封装的。
java代码:
Bo类：
package com.test.bo;
import java.util.List;
public class GridBo {
private int totalProperty;
private String id;
private String name;
private List root;
public int getTotalProperty() {
return totalProperty;
}
public void setTotalProperty(int totalProperty) {
this.totalProperty = totalProperty;
}
public String getId() {
return id;
}
public void setId(String id) {
this.id = id;
}
public String getName() {
return name;
}
public void setName(String name) {
this.name = name;
}
public List getRoot() {
return root;
}
public void setRoot(List root) {
this.root = root;
}
}
action类：
import java.io.IOException;
import java.io.PrintWriter;
import java.util.ArrayList;
import java.util.HashMap;
import java.util.List;
import java.util.Map;
import javax.servlet.http.HttpServletResponse;
import org.apache.struts2.ServletActionContext;
import com.alibaba.fastjson.JSONObject;
import com.test.bo.GridBo;
public void grid(){
//获取当前的起始行
int start = Integer.parseInt(ServletActionContext.getRequest().getParameter("start"));
//获取每页的显示行数
int limit = Integer.parseInt(ServletActionContext.getRequest().getParameter("limit"));
GridBo grid = new GridBo();
grid.setTotalProperty(100);
List list = new ArrayList();
String root = "";
for(int i = start;i < start+limit;i++){
Map obj=new HashMap();
obj.put("id", i);
obj.put("name", "name"+i);
list.add(obj);
}
grid.setRoot(list);
HttpServletResponse response = ServletActionContext.getResponse();
response.setCharacterEncoding("utf-8");
try {
PrintWriter writer = response.getWriter();
writer.print(JSONObject.toJSON(grid).toString());
} catch (IOException e) {
e.printStackTrace();
}
}
}
jsp页面：
<html>
<head>
<script type="text/javascript"></script>
<link rel="stylesheet" type="text/css" href="./ext/resources/css/ext-all.css">
<script type="text/javascript" src="./ext/adapter/ext/ext-base.js"></script>
<script type="text/javascript" src="./ext/ext-all.js"></script>
<script type="text/javascript" src="./js/grid1.js"></script>
<link rel="stylesheet" type="text/css" href="./css/menu.css">
<script type="text/javascript">
</script>
</head>
<body>
<div id="container">
<div id="grid"></div>
</div>
</body>
</html>
js页面：
Ext.onReady(function(){
var cm = new Ext.grid.ColumnModel([
{header:'编号',dataIndex:'id',width:50,sortable:true},
{header:'名称',dataIndex:'name',width:100,sortable:true}
]);
var store = new Ext.data.Store({
proxy:new Ext.data.HttpProxy({url:'function_grid.action'}),
reader:new Ext.data.JsonReader({
totalProperty:'totalProperty',
root:'root',
fields:[
{name:'id'},
{name:'name'}
]})
});
var grid = new Ext.grid.GridPanel({
renderTo:'grid',
store:store,
cm:cm,
autoWidth:true,
autoHeight:true,
stripeRows:true,
loadMask:true,
viewConfig:{
forceFit:true,
enableRowBody:true,
columnsText:'显示的列',
sortAscText:'升序',
sortDescText:'降序',
scrollOffset:1
},
bbar:new Ext.PagingToolbar({
pageSize:10,
store:store,
displayInfo:true,
displayMsg:'显示第{0}条到{1}条记录,一共{2}条',
emptyMsg:'没有记录'
})
});
store.load({params:{start:0,limit:10}});
});
效果图如下:
java代码:
Bo类：
package com.test.bo;
import java.util.List;
public class GridBo {
private int totalProperty;
private String id;
private String name;
private List root;
public int getTotalProperty() {
return totalProperty;
}
public void setTotalProperty(int totalProperty) {
this.totalProperty = totalProperty;
}
public String getId() {
return id;
}
public void setId(String id) {
this.id = id;
}
public String getName() {
return name;
}
public void setName(String name) {
this.name = name;
}
public List getRoot() {
return root;
}
public void setRoot(List root) {
this.root = root;
}
}
action类：
import java.io.IOException;
import java.io.PrintWriter;
import java.util.ArrayList;
import java.util.HashMap;
import java.util.List;
import java.util.Map;
import javax.servlet.http.HttpServletResponse;
import org.apache.struts2.ServletActionContext;
import com.alibaba.fastjson.JSONObject;
import com.test.bo.GridBo;
public void grid(){
//获取当前的起始行
int start = Integer.parseInt(ServletActionContext.getRequest().getParameter("start"));
//获取每页的显示行数
int limit = Integer.parseInt(ServletActionContext.getRequest().getParameter("limit"));
GridBo grid = new GridBo();
grid.setTotalProperty(100);
List list = new ArrayList();
String root = "";
for(int i = start;i < start+limit;i++){
Map obj=new HashMap();
obj.put("id", i);
obj.put("name", "name"+i);
list.add(obj);
}
grid.setRoot(list);
HttpServletResponse response = ServletActionContext.getResponse();
response.setCharacterEncoding("utf-8");
try {
PrintWriter writer = response.getWriter();
writer.print(JSONObject.toJSON(grid).toString());
} catch (IOException e) {
e.printStackTrace();
}
}
}
jsp页面：
<html>
<head>
<script type="text/javascript"></script>
<link rel="stylesheet" type="text/css" href="./ext/resources/css/ext-all.css">
<script type="text/javascript" src="./ext/adapter/ext/ext-base.js"></script>
<script type="text/javascript" src="./ext/ext-all.js"></script>
<script type="text/javascript" src="./js/grid1.js"></script>
<link rel="stylesheet" type="text/css" href="./css/menu.css">
<script type="text/javascript">
</script>
</head>
<body>
<div id="container">
<div id="grid"></div>
</div>
</body>
</html>
js页面：
Ext.onReady(function(){
var cm = new Ext.grid.ColumnModel([
{header:'编号',dataIndex:'id',width:50,sortable:true},
{header:'名称',dataIndex:'name',width:100,sortable:true}
]);
var store = new Ext.data.Store({
proxy:new Ext.data.HttpProxy({url:'function_grid.action'}),
reader:new Ext.data.JsonReader({
totalProperty:'totalProperty',
root:'root',
fields:[
{name:'id'},
{name:'name'}
]})
});
var grid = new Ext.grid.GridPanel({
renderTo:'grid',
store:store,
cm:cm,
autoWidth:true,
autoHeight:true,
stripeRows:true,
loadMask:true,
viewConfig:{
forceFit:true,
enableRowBody:true,
columnsText:'显示的列',
sortAscText:'升序',
sortDescText:'降序',
scrollOffset:1
},
bbar:new Ext.PagingToolbar({
pageSize:10,
store:store,
displayInfo:true,
displayMsg:'显示第{0}条到{1}条记录,一共{2}条',
emptyMsg:'没有记录'
})
});
store.load({params:{start:0,limit:10}});
});
效果图如下:
分享到：
发表评论
-
如何保证在Java多线程中的原子性操作？
2019-08-27 18:46 964在单线程的模 ... -
Java内存模型简单介绍
2019-08-19 19:52 824说到Java内存 ... -
java中线程挂起的几种方式
2019-08-16 18:43 1155在Java中使用线程的时候肯定会有线程挂起的 ... -
自定义线程池简单介绍
2019-08-16 11:37 1029线程池的相关概念就不在这里说明了，百度一下有很 ... -
实现自己的spring boot starter
2019-04-04 14:59 947在使用spring boot开发的时候，我 ... -
使用POI实现合并行的导入
2019-03-01 17:24 2750在我们进行导入的时候难免不会遇到合并行的导入 ... -
Spring IOC设计原理解析
2019-01-08 14:02 1070摘自https://www.cnblogs.com/ITt ... -
SpringBoot集成自定义HandlerMethodArgumentResolver参数初始值解析
2018-12-13 09:25 2308大部分摘抄自https://www.cnblogs.com/ ... -
关于spring cloud config加密EncryptionTooWeakException异常说明
2018-11-05 16:00 2168今天在使用spring cloud confi ... -
gradle使用mybatis-generator生成user表相关文件只生成mysql..user的原因说明
2018-07-23 15:42 4219在gradle中使用 ... -
SpringBoot+Activiti的serviceTask注入异常问题
2018-07-13 11:51 7646在使用springboot+activiti ... -
16进制与字符串的互转及转换为byte数组
2018-05-25 14:42 3280import java.io.ByteArrayOutput ... -
JVM学习总结
2018-01-29 17:00 1104JVM作为java的重要组成部分，在j ... -
利用JavaFX创建一个可以订阅发布的MQTT客户端桌面程序
2017-12-08 11:34 2141利用JavaFX我们可以创建出像Swing那样 ... -
java8新特性time类相关介绍
2017-10-30 15:46 1700java8已经出来 ... -
java动态添加外部jar包到classpath
2017-08-17 16:38 3178在项目开发过程中我们有时候需要动态的添加 ... -
java 10进制转16进制带ox格式输出
2017-07-14 16:36 2955摘自https://yq.aliyun.com/wenzha ... -
SpringBoot+thymeleaf简单实现登陆注册及记账功能
2017-06-26 10:58 12573本项目主要是使用了SpringBoot及其 ... -
Java 8的新特性—终极版
2017-05-25 16:42 944前言： Java 8 已经发 ... -
对\\uxx转换为unicode编码的\uxx
2017-03-10 16:17 1530在业务过程中难免会遇到字符串转换为16进制的u ...
相关推荐
Extjs动态Grid的生成 htm
这个例子程序源码主要展示了如何将两者结合，动态生成Grid列表。 在ASP.NET中，开发者通常使用C#或VB.NET作为后端编程语言，通过ASP.NET MVC或Web Forms模式来处理HTTP请求并返回HTML响应。EXTJS则负责在客户端渲染...
本文将深入探讨如何在ExtJS中动态生成Grid，这是一个非常实用的功能，可以适应不断变化的数据需求和用户交互。我们首先从标题"ExtJs动态grid的生成"开始，了解动态生成Grid的基本概念和实现方法。 动态生成Grid意味...
内容索引:.NET源码,Ajax相关,EXTjs 结合EXTJS类库动态生成Grid数据列表的演示，如果你没有配置数据库信息，那么程序运行时会自动弹出数据安装窗口，安装完成就可以查看演示了，基于EXT风格的Ajax数据列表，简洁实用...
在本文中，我们将深入探讨如何使用ExtJS框架在前端动态生成表格，并结合后端数据进行展示。ExtJS是一个强大的JavaScript库，专用于构建富客户端Web应用程序，尤其在创建交互式用户界面方面表现突出。动态生成表格是...
"ExtJS 4.2 动态生成Toolbar" 在 ExtJS 4.2 中实现动态生成 Toolbar，以满足 gridPanel 中动态生成带按钮及查询条件的工具栏的需求。本文将详细介绍如何实现动态生成 Toolbar，包括视图层、 Toolbar.js 和后台调用...
EXTJS代码生成器是一款专为开发人员设计的工具，它能够自动生成基于EXTJS框架的MVC模式应用程序的代码，显著提升开发效率。EXTJS是一个强大的JavaScript库，用于构建富客户端Web应用，提供了丰富的组件库和强大的...
6. **动态列生成**：根据后台返回的列信息动态创建和配置Grid的列，这通常涉及到解析JSON数据中的列头信息。 7. **优化性能**：考虑使用分页（Paging）和延迟加载（Lazy Loading）来优化大数据量的加载，提高用户...
这是利用sencha cmd 生成的GridFilterDemo工程中的app和build文件夹，其余文件过大并且与主题无关,因此未包含。具体方法，请参看我的博客: 《Extjs4.2 Grid Filter Feature 表格过滤特性》
在EXTJS中，Grid控件是用于展示大量结构化数据的关键组件，具有丰富的功能和高度可定制性。本文将深入讲解EXTJS Grid如何实现数据导出到Excel文件的功能。 首先，我们要明白EXTJS Grid的数据导出到Excel的过程通常...
在本文中，我们将深入探讨如何使用ExtJS框架根据数据库返回的JSON数据动态生成Grid列表实例。ExtJS是一款强大的JavaScript库，常用于构建富客户端应用程序，尤其是数据可视化和数据管理组件，如Grid。Grid是ExtJS中...
在"Extjs tree and Grid(Buffer Grid,Progress Grid)"这个主题中，我们将深入探讨这两个核心组件以及它们的特定变体——缓冲网格（Buffer Grid）和进度网格（Progress Grid）。 1. **ExtJS Tree** - 树形控件...
1. **EXTJS Grid组件**：EXTJS Grid是EXTJS的核心组件之一，它允许开发者创建可分页、可排序、可过滤的数据表格。Grid可以与各种数据源（如JSON、XML或内存中的数组）配合使用，并通过Store对象进行数据的加载和管理...
在使用ExtJS4开发一个grid的时候，经常会遇到需要对grid的列进行动态的显示和隐藏操作，以适应不同的显示需求。ExtJS4中的gridpanel组件提供了一些内置的方法来控制列的可见性，但有时候需要一个更直观的方式来实现...
在标题中提到的"ExtJS4.0 分享Grid导出Excel插件"是一个扩展功能，允许用户将ExtJS Grid中的数据导出为Microsoft Excel格式的文件。这对于数据分析、报表生成以及数据共享非常有用。 这个插件是针对ExtJS 4.0版本...
2. 添加一个按钮或菜单项，当点击时触发Grid的`exportStore`方法，该方法会根据配置的`Exporter`插件生成并下载文件。 3. 在事件处理函数中，调用`grid.getView().getFeatures()[0].exportStore(store, type, ...
- 对于Grid的列，我们可以使用`Ext.grid.column.Column`的`tooltip`配置项，或者使用`renderer`函数来动态生成Tooltip内容。 2. **配置列的Tooltip**： - 在定义Grid的列模型时，可以直接在列配置对象中设置`...
在ExtJS4中，动态生成的Grid控件是一种常见的数据展示方式，它可以灵活地根据后台数据动态构建列结构。然而，对于这样的Grid，如何将其内容导出为Excel格式可能会成为一个挑战。本文将介绍一个实现这一功能的示例，...
这个"extjs动态表头"的资源很可能是一个插件或组件，名为`Ext.ux.grid.DynamicGridPanel.js`，它扩展了ExtJS的标准GridPanel，增加了动态调整列的能力。 动态表头的核心功能包括： 1. **实时编辑**：用户可以在...
在IT领域，特别是Web开发中，ExtJS是一个广泛使用的JavaScript框架，它提供了丰富的用户界面组件，包括表格（Grid）等。动态表头是ExtJS中一个高级特性，它允许开发者根据需要在运行时动态地创建和修改表格的列结构...