项目中遇到了要用动态表格头，即表格标题列数和内容不确定，由后台传回的数据来生成表格头，花了一天时间，也在网上找了不少资料，但是基本没一个有用，不过还是给了自己不少启发，自己摸索着，终于搞定了，在此记录下来，以便以后查阅。欢迎指正！！！
1、strust2的配置文件代码
<package name="defineReportJson" extends="json-default"> <action name="defineListReportData" class="com.audit.action.reportJFree.DefineListReportAction" method="defineListReportData"> <result type="json" name="success"></result> </action> </package>
2、strusts2的Action类方法代码，以下各个属性提供相应的get方法
public String defineListReportData() throws Exception {
columnModel = "[{'header':'姓名','width':60,'dataIndex':'Name','align':'center'}," +
"{'header':'生日','width':60,'format':'Y-m-d','dataIndex':'Birthday','align':'center','renderer': Ext.util.Format.dateRenderer('Y-m-d')}," +
"{'header':'学历','width':60,'dataIndex':'Edu','align':'center'}," +
"{'header':'备注','width':60,'dataIndex':'Memo','align':'center'}]";
data = "[" +
"{ name: '李赞红',birthday: Date.parseDate('1979-04-11', 'Y-m-d'), edu: '本科', memo: '无备注' }," +
"{ name: '陈南',birthday: Date.parseDate('1987-08-06', 'Y-m-d'), edu: '本科', memo: '一个小帅哥哈' }," +
"{ name: '陈南',birthday: Date.parseDate('1987-08-06', 'Y-m-d'), edu: '本科', memo: '一个小帅哥哈' }," +
"{ name: '陈南',birthday: Date.parseDate('1987-08-06', 'Y-m-d'), edu: '本科', memo: '一个小帅哥哈' }," +
"{ name: '陈南',birthday: Date.parseDate('1987-08-06', 'Y-m-d'), edu: '本科', memo: '一个小帅哥哈' }" +
"]";
fieldsNames = "[" +
"{name: 'Name', type: 'string', mapping: 'name'}, " +
"{name: 'Birthday', type: 'string', mapping: 'birthday'}, " +
"{name: 'Edu', type: 'string', mapping: 'edu'}, " +
"{name: 'Memo', type: 'string', mapping: 'memo'}" +
"]";
total = 4;
return SUCCESS;
}
3、好了，到了最关键的时候了，就是ExtJS代码咯！请看下面详细，这就是一份完整的JSP文件，直接用就行。。。
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%@include file="../../ext-common.jsp"%>
<!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>Extjs动态加载Grid表格</title>
<script type="text/javascript">
Ext.onReady(function(){
Ext.Ajax.request({
url:'defineListReportData.action',
success:function(response,option){
var jsonText = Ext.util.JSON.decode(response.responseText);
// 列模型 即表格头
//var headColumn = $.parseJson(jsonText.columnModel);(此处需引用JQery文件)
var headColumn = eval("(" + jsonText.columnModel + ")");
var cm = new Ext.grid.ColumnModel(headColumn);
//Record 定义数据项的逻辑结构,列信息
var field = jsonText.fieldsNames;
var Human = Ext.data.Record.create(eval("(" + field + ")"));
//Reader 对逻辑数据进行分装
var reader = new Ext.data.JsonReader({}, Human);
//准备数据
var data = eval("(" + jsonText.data + ")");
//MemoryProxy ,获取数据
var proxy = new Ext.data.MemoryProxy(data);
//Store 存储器，用于整合Proxy和Reader
var store = new Ext.data.Store({
proxy: proxy,
reader: reader
});
store.load(params : {start : 0,limit : 20});
var grid = new Ext.grid.GridPanel({
title: "自定义报表数据",
//autoWidth: true,
width:jsonText.total * 60 + 160,
autoHeight: true,
cm: cm,
store: store,
renderTo: "dyngrid",
buttonAlign:"center",
stripeRows: true, //让grid相邻两行背景色不同
bbar : new Ext.PagingToolbar({
pageSize : 20,
store : store,
displayInfo : true,
displayMsg : '显示第{0}条到{1}条记录，一共{2}条',
emptyMsg : "没有记录"
}),
viewConfig : {
columnsText : '显示的列',
scrollOffset : 30,
sortAscText : '升序',
sortDescText : '降序',
forceFit : true
}
});
},
failure:function(){
Ext.Msg.alert("错误提示","数据加载失败！");
}
});
});
</script>
</head>
<body>
<div id="dyngrid"></div>
</body>
</html>
这只是实现了表格头不固定，分页啥的都还没做好，先贴上代码，后面做好了再更新
相关推荐
通过这个实例，开发者可以掌握ExtJS和Struts2的结合使用，实现动态数据驱动的表格，这对于开发数据密集型的Web应用非常有帮助。同时，封装Grid组件也是提升开发效率的一个重要实践。记得在实际应用中，根据需求进行...
在这个"EXTJS4+STRUTS2+JAVA增删改查"的例子中，我们将深入探讨这三个技术如何协同工作，实现数据的动态管理。 EXTJS4是一个强大的JavaScript库，主要用于创建桌面级的Web应用程序。它提供了丰富的组件库，如表格、...
6. **工程实例**："Struts2_ExtJS"可能是实际整合后的工程源码，可以作为学习和参考的模板，通过阅读和运行这个工程，开发者可以更直观地理解两者的整合过程。 总的来说，ExtJS与Struts2的整合能够充分发挥两者的...
标题 "Extjs4.0+struts2简单MVC 实例demo" 提供了一个关于使用ExtJS 4.0框架与Struts2 MVC框架结合开发应用程序的实际示例。这是一个常见的前端与后端集成方案，旨在展示如何在Java Web项目中有效地处理用户界面和...
Struts2、ExtJS和JSON是Web开发中的三个关键技术，它们在构建动态、交互式的Web应用程序时发挥着重要作用。下面将详细介绍这三个技术及其整合过程。 首先，Struts2是一个基于MVC（Model-View-Controller）设计模式...
这个“ExtJS Struts实例程序”是一个演示了如何将这两者结合使用的项目。 在深入探讨之前，让我们先了解这两个技术的基础知识： 1. **ExtJS**：由Sencha公司开发，它提供了丰富的组件库，包括表格、表单、树视图、...
总之，结合ExtJS4的前端交互能力和Struts2的后端处理能力，你可以构建出一个高效且用户体验良好的文件上传系统。通过理解这两个技术的工作原理和相互配合的方式，你可以灵活地定制自己的文件上传解决方案。
综上所述，这个项目提供了EXTJS、Struts和Ajax的集成应用实例，适合想要深入学习这三种技术的开发者。通过研究项目代码和文档，可以掌握前端EXTJS界面的构建、后端Struts的控制器设计以及如何利用Ajax实现页面的异步...
ExtJS 是一个强大的JavaScript库，专门用于构建富...前端利用ExtJS构建动态、交互性强的用户界面，后端利用Struts处理业务逻辑和数据操作。这种架构有利于提升用户体验，同时使前后端开发更加解耦，便于维护和扩展。
在IT行业中，构建Web应用程序是常见的任务，而“Hibernate+Spring+Struts2+ExtJS开发CRUD功能实例”提供了一个完整的解决方案，用于快速开发基于Java的Web应用，特别是涉及数据库操作的CRUD（创建、读取、更新、删除...
总的来说，"Struts+Extjs4.0实例"展示了如何利用这两种技术结合的优势，打造功能强大、用户体验优秀的Web应用。Struts处理后端逻辑，保证业务的稳定性和安全性；ExtJS4.0专注于前端展现，提升用户的操作体验。这种...
ExtJS、Struts2和JDBC是Web开发中常见的技术栈，它们的结合可以构建功能丰富的交互式Web应用。这个小例子提供了一个基于这些技术的简单增删改查（CRUD）操作的实现，对于初学者来说是一个很好的学习资源。 ExtJS是...
在本项目中，我们探讨的是一个基于Java技术栈的图书管理系统实现，具体采用了Spring、Struts2、iBatis和ExtJS这四个核心技术。这个系统旨在提供全面的图书管理功能，包括图书的增删改查、用户管理以及可能的借阅、...
这是一个基于Web的图书管理系统，利用了前端框架ExtJS，后端MVC框架Struts2以及持久层框架Hibernate。下面将详细解析这个系统的核心技术和实现原理。 **ExtJS** 是一个强大的JavaScript库，用于构建富客户端应用...
Struts、Spring、iBatis 和 ExtJS 是四个在IT行业中广泛应用的开源框架和技术，它们在构建企业级Java Web应用程序时发挥着重要作用。这个实例由Atanas Neshkov创建，旨在展示这些技术如何协同工作，提供高效且用户...
【图书管理系统源码（ExtJs+struts2+hibernate+spring）】是一个基于Web的软件项目，它展示了如何整合多种技术来构建一个实际的应用系统。这个管理系统使用了前端框架ExtJs，后端MVC框架Struts2，持久层框架...
### Struts2+Spring+Hibernate+ExtJS集成开发详解 #### 一、技术栈概览与集成背景 在企业级应用开发中，采用MVC架构的项目常常会使用到多种框架来实现不同的业务需求，其中Struts2、Spring、Hibernate以及ExtJS是...
《EXTJS + Struts2 + iBatis + SQLServer开发实例》 这是一个综合性的IT教程，专注于使用EXTJS、Struts2、iBatis和Spring框架进行Web应用程序开发的实践案例。这些技术都是Java Web开发中的重要组成部分，各自在...
总之，“ExtJS4+JSON+Servlet(Struts2)实现登录验证”是一个涵盖了前端交互、数据传输和后端处理的综合实例，对于理解和掌握Web应用开发有极大的帮助。通过深入研究这一主题，开发者可以提升在客户端脚本、数据交换...
在EXTJS端，我们可以创建一个简单的组件，如表格，通过Ajax请求获取STRUTS2返回的JSON数据，并将其填充到表格中。EXTJS提供了丰富的组件库和数据绑定机制，使得前端UI的构建和数据交互变得非常便捷。 总的来说，...