Extjs学习------MVC结构的开发(从后台获取数据显示到Grid)
来源:互联网 发布:明道办公软件网页版 编辑:程序博客网 时间:2024/06/05 20:24
Extjs学习------MVC结构的开发(从后台获取数据显示到Grid)
上次是一个登陆的Form,大概就是从Extjs前台获取数据,提交到后台的Action进行验证,这次是一个从后台的Action获取数据,然后将其显示到前台Extjs的Grid中,截图如下:
文档目录结构:
DHApp(所有的Ext的app文件夹都放在这个里边)
|---OrganizationApp(显示所有部门的类似于表格的ext,继承自Ext.grid.panel)
|---controller(包含文件:OrgCtrl.js)
|---model (包含文件:OrgModel.js)
|---store (包含文件:OrgStore.js)
|---view (包含文件:OrgList.js)
|---OrgApp.js
首先仍然是创建一个入口app,即OrgApp.js
这里的xtype:‘orglist‘即为view下边的OrgList.js,是页面显示的Grid的布局文件
Grid里边要显示的内容是什么呢?这个就是通过 store : 'OrgStore'这句话来解释了,从OrgStore.js里边的配置可以找到数据源,也就是Grid要显示的数据:
而上边Store存储数据的项都有那些则是通过OrgModel来定义的:
这里获得的json数据只有两个:机构名称、所属机构名称
Store获取数据的数据源为:url: 'jsp/orgAction.do?method=getOrgData'
数据解析的类型和Store中存储的总记录数、存储记录的根节点都在proxy中进行定义
下面是后台获取数据的代码(对数据库访问的DAO和获取数据的代码就不贴了):
由于通过queryDao.GetOrganizationData()直接从数据库获得的数据时一个list,而list中存储的每一条记录都是一个Object数据,这个数组里边存储的就是我们的Grid中的一行要显示的数据,所以通过下边的for循环对获取的数据进行格式上的规范化,然后通过response将数据传出
对了,传递的代码如下:
public void SendMessage(HttpServletResponse response, String content) throws IOException {
response.setContentType("application/xml;charset=utf-8");
response.setCharacterEncoding("UTF-8");
response.getWriter().write(content);
}
Struts2中可以通过HttpServletResponse response = ServletActionContext.getResponse()来获取response对象,而Struts1中由于函数参数中直接已经存在了response对象,所以就通过传递参数来解决了用FireFox的firebug拦截下来的Extjs在前台获取的数据的格式截图如下:
前边尝试的时候是从json文件中获取数据的,在从后台获取数据的时候关于struts1得到了数据如何传出去纠结了老半天,刚开始时直接自定义函数,没有任何参数,然后从外边访问,结果肯定出错了,后来加了参数,仍然不行,最后将返回值改成ActionForward,算是勉强搞定了,后来查了资料有了一定的了解
现在暂时没有加入分页的代码,比较糙。
- Extjs学习------MVC结构的开发(从后台获取数据显示到Grid)
- extjs grid取到数据而不显示的解决
- mvc-ajax(从后台取数据显示到页面上)
- 使用echart从后台获取数据动态显示到页面
- Extjs grid 获取双击的项数据
- extjs grid summary 获取平均分数据,并传递object后后台,存储得到想要的数据。
- struts+extjs grid显示数据
- EXTJS获取grid中的数据
- extjs获取后台数据(asp.net)
- extjs的grid只显示一行数据的问题
- Extjs Grid 合并两列显示的数据
- ExtJS两个grid用同一个store显示不同的数据
- Extjs grid只能显示一条数据的问题
- 第一次使用echart从后台获取数据动态显示到页面
- 第一次使用echart从后台获取数据动态显示到页面
- extjs grid 从json 获取动态列
- Extjs问题 -- grid只能显示一条数据
- EXTJS 从grid 读取一行数据显示在formpanel中的 date问题
- Proc*C实例三 -- 数据库代码逻辑代码分离
- IOS 序列化与反序列化
- 如何在Windows下使用LAPACK和ARPACK
- live555代码解读之二:DESCRIBE请求消息处理过程
- javascript匿名函数和闭包
- Extjs学习------MVC结构的开发(从后台获取数据显示到Grid)
- live555代码解读之三:SETUP和PLAY请求消息处理过程
- bean 初始化
- Unsupported major.minor version 51.0 intellij 错误
- ubuntu12.04 卸载和安装mysql
- oracle数据库导入导出
- 使用syslinux制作启动U盘
- Jsoup学习之Jsoup类
- Activity透明