EXTJS4.x之实战项目(4)填充ArticleGridPanel的数据
来源:互联网 发布:合肥办公软件培训班 编辑:程序博客网 时间:2024/06/09 04:14
经过上面的步骤我们可以得到大致的程序框架,可以切换tabpanel的显示内容,下面我们来填充ArticleGridPanel数据。
1.添加model,如下图,添加一个Model
userClassName配置为ArticleInfo。
为ArticleInfo添加以下field:
2.创建store,配置以下属性
userClassName : ArticleStore;
storeId : ArticleStore;
model : ArticleInfo;
pageSize : 20;
为ArticleStore添加ajax proxy,直接拖到ArticleStore即可。
配置ajax proxy的属性如下
url : '../article/list';
为ajax proxy 添加一个json reader。找到json reader 拖动到ajax proxy即可,配置以下属性
root: 'results',
totalProperty: 'totalCount'
3.设置ArticleGridPanel的store为ArticleStore。selection model为CheckboxModel,forceFit打勾,columnLines打勾,在ArticleGridPanel上点击右键选择auto columns
自动生成显示的字段.现在工程的情况如下
保存运行得到如下图效果
- EXTJS4.x之实战项目(4)填充ArticleGridPanel的数据
- EXTJS4.x之实战项目(5)ArticleGridPanel实现增删改查之增
- EXTJS4.x之实战项目(6)ArticleGridPanel实现增删改查之改
- EXTJS4.x之实战项目(7)ArticleGridPanel实现增删改查之删
- EXTJS4.x之实战项目(8)ArticleGridPanel实现增删改查之查
- EXTJS4.x之实战项目(2)左侧菜单数据填充数据
- EXTJS4.x之实战项目(1)
- EXTJS4.x之实战项目(3)菜单控制器MenuPanelController
- EXTJS4.x之实战项目(9)SectionContentGridPanel栏目内容管理页的实现
- MVC 框架实战中-之数据填充
- EXTJS4.x之ToolBar的使用
- EXTJS4.x之combobox的使用
- EXTJS4.x之可编辑的grid
- EXTJS4.x之grid(1)
- EXTJS4.x之国际化
- React Native项目实战之fetch请求并填充界面
- ExtJS4.x数据模型之Model
- ExtJS4.x数据模型之Proxy
- python calendar模块
- Android获取内部和外部内存空间大小
- 5 gdb server建立 利用openocd配合jlink仿真器。 下载openocd-0.3.1.tar.bz2文件,解压。 下载libusb,用来支持jlink。 运行以下命令编译op
- session的get()方法和load()方法的区别
- 基于三星ARM9(S3C2410)的交通违章抓拍系统的开发
- EXTJS4.x之实战项目(4)填充ArticleGridPanel的数据
- Oracle创建用户授权
- Ubuntu解压缩指令
- dom4j是什么
- NDK程序的调试方法
- The type javax.servlet.http.HttpServletRequest cannot be resolved
- BugFree修改端口后上传图片无法显示问题。
- iText5.4.2 pdf加密、水印签名
- 用异或来交换两个变量不一定提高了效率