`

第二章-ExtJs-grid

阅读更多

grid

本章任务

1.grid

/**
 * 页面加载
 */
Ext.onReady(function() {

			/**
			 * 列模型
			 */
			var _cm = new Ext.grid.ColumnModel({
						columns : [{
									header : '用户名',
									dataIndex : 'userName'
								}, {
									header : "密码",
									dataIndex : 'userPass'
								}]
					});

			/**
			 * 字段类型
			 */
			var _fields = new Ext.data.Record.create([{
						name : 'userName',
						type : 'string'
					}, {
						name : 'userPass',
						type : 'string'
					}]);
			/**
			 * 数据集
			 */
			var _store = new Ext.data.JsonStore({
						url : './ch02.jsp',
						root : 'users',
						fields : _fields
					});

			/**
			 * 显示数据
			 */
			var _grid = new Ext.grid.GridPanel({

				width : 300,//宽
				height : 300,//高
				renderTo : Ext.getBody(),
				cm : _cm,//列模型
				store : _store//数据集
				});

			/**
			 * 加载数据
			 * 
			 */
			_store.load({})
		});

 

 

本章目标

1. 理解Grid

分享到:
评论

相关推荐

    ExtJS 教程

    2. **第二章 - Ext概览**: 这章会更深入地讨论ExtJS的核心概念,如布局(Layouts)、组件模型(Component Model)以及事件处理。理解这些概念是构建复杂UI的基础。 3. **第三章 - 表单**: ExtJS的表单功能强大,...

    Extjs教程_第五章_使用grid显示数据(2)

    在第五章的第二部分,主要讨论了如何使用Grid来显示数据,特别是通过单元格渲染器(cell renderer)增强数据的表现力和功能。 单元格渲染器允许开发者自定义单元格的内容和样式,使其更加美观且适应业务需求。EXTJS...

    ExtJS.in.Action

    第二章“Back to the basics”则着重讲解了ExtJS的基础概念和技术要点,包括如何设置项目环境、理解基础类库以及如何创建基本的UI组件。通过这一章的学习,读者可以掌握ExtJS的核心概念,并为后续学习打下坚实的基础...

    ExtJs教程_完整版

    ### ExtJs教程_完整版 —— 第一章起步(1)关键知识点详解 #### 一、ExtJS概述 **1.1 极致的用户体验** ExtJS是一个强大的JavaScript框架,专为Web应用开发而设计。它以其优雅的API、丰富的组件集合以及出色的跨...

    ExtJSWeb应用程序开发指南(第2版)

    前言 第1章 认识ExtJS 1.1 ExtJS的精彩表现 ...第12章 Grid组件 第13章 Tree组件 第14章 ExtJS与服务端框架的整合 第15章 主题 第16章 Ext.Direct 第17章 Draw图形 第18章 Chart图表 附录A

    extjs学习案例, 例子有 panel ,widow,tree,grid,form, store……

    在ch2目录下,可能包含了第二章的学习内容,如更复杂的布局、组件交互或数据管理等实例。 总的来说,ExtJS的学习涵盖了许多方面,从基础的组件使用到高级的数据管理和交互设计。通过实践这些案例,你可以更好地理解...

    轻松搞定ExtJS

    #### 第二十二章:GridPanel扩展 - **学会自学吧,朋友**:鼓励读者通过自学掌握更多的Extjs知识。 - **带摘要的GridPanel**:介绍了如何为GridPanel添加摘要信息。 - **RowExpander**:讲解了RowExpander插件的使用...

    extjs的教程里面含有代码列子详解

    #### 第二章:EXTJS框架基础 本章深入探讨了EXTJS的核心概念和技术细节。 - **事件和类**:详细介绍了EXTJS中的事件处理机制,包括自定义事件、浏览器事件等。 - **核心组件**:阐述了EXTJS中重要的基础组件,如`...

    Ext中文文档

    #### 第二章:准备与资源 - **下载与布署环境**:文档指导读者如何下载ExtJS及其依赖库,并设置开发环境,确保所有必要的资源到位。 - **SpketIDE**:推荐使用特定的集成开发环境(IDE),如SpketIDE,以提高开发效率...

    Efs c# 帮助文档

    #### 第二章 文件引入 - **CSS文件引用**:为了确保Efs框架的样式能够正常显示,在页面头部需要引用ExtJS提供的CSS文件。例如:`<link rel="stylesheet" type="text/css" href="css/ext-all.css"/>` - **...

    EfsFrame Web表现层API文档

    #### 第二章 文件引入 - **样式表与脚本文件**:为了在项目中使用Efs框架,需要在HTML文件中引入必要的CSS和JavaScript文件。具体而言,需要引入`ext-all.css`和`efs-all.css`两个样式表文件,以及`loadmask.js`等...

    Ext+JS深入浅出

    本书第三章详细介绍了 Grid 的使用方法,包括如何创建简单的 Grid、如何添加排序功能、如何处理中文排序问题、如何在单元格内显示特殊格式的数据(如红色文字、图片和按钮)等。 #### 四、总结 **EXTJS** 不仅提供...

    RDF 使用帮助

    #### 第二章:文件引入 为了在网页中使用 RDF,需要正确地引入必要的 CSS 和 JavaScript 文件。这些文件包括: - `ext-all.css`:ExtJS 框架的样式文件,负责页面的基本样式和布局。 - `rdf-all.css`:RDF 框架的...

    Practical.Ext.JS.4.pdf

    第二章“Overview of ExtJS4”为读者提供了一个Ext JS 4的概览,讨论了其特性,比如组件化结构、丰富的UI控件和兼容性等。这部分内容为读者理解Ext JS 4框架的整体架构和设计理念提供了基础。 第三章...

Global site tag (gtag.js) - Google Analytics