extjs
关注
分享
扫一扫
zhiming_817
这个作者很懒，什么都没留下…
展开
专栏收录文章
- 默认排序
- 最新发布
- 最早发布
- 最多阅读
- 最少阅读
-
《ExtJS2.0实用简明教程》之应用ExtJS
应用extjs需要在页面中引入extjs的样式及extjs库文件，样式文件为resources/css/ext-all.css，extjs的js库文件主要包含两个，adapter/ext/ext-base.js及ext-all.js，其中ext-base.js表示框架基础库，ext-all.js是extjs的核心库。adapter表示适配器，也就是说可以有多种适配器，因此，可以把adapter/e...2010-02-22 17:25:20 · 111 阅读 · 0 评论 -
《ExtJS2.0实用简明教程》之Accordion布局
Accordion布局由类Ext.layout.Accordion定义，名称为accordion，表示可折叠的布局，也就是说使用该布局的容器组件中的子元素是可折叠的形式。来看下面的代码: Ext.onReady(function(){ new Ext.Panel({ renderTo:"hello", title:"容器组件", width:500, heigh...原创 2010-02-26 15:14:50 · 149 阅读 · 0 评论 -
《ExtJS2.0实用简明教程》之Card布局
Card布局由Ext.layout.CardLayout类定义，名称为card，该布局将会在容器组件中某一时刻使得只显示一个子元素。可以满足安装向导、Tab选项板等应用中面板显示的需求。看下面的代码： Ext.onReady(function(){ var panel=new Ext.Panel({ renderTo:"hello", title:"容器组件", wid...2010-02-26 15:59:36 · 125 阅读 · 0 评论 -
《ExtJS2.0实用简明教程》之able布局及其它布局
Table布局由类Ext.layout.TableLayout定义，名称为table，该布局负责把容器中的子元素按照类似普通html标签 Ext.onReady(function(){ var panel=new Ext.Panel({ renderTo:"hello", title:"容器组件", width:500, height:200, lay...2010-02-26 16:17:52 · 224 阅读 · 0 评论 -
《ExtJS2.0实用简明教程》之基本表格GridPanel
ExtJS中的表格功能非常强大，包括了排序、缓存、拖动、隐藏某一列、自动显示行号、列汇总、单元格编辑等实用功能。 表格由类Ext.grid.GridPanel定义，继承自Panel，其xtype为grid。ExtJS中，表格Grid必须包含列定义信息，并指定表格的数据存储器Store。表格的列信息由类Ext.grid.ColumnModel定义、而表格的数据存储器由Ext.data....2010-02-26 18:24:31 · 140 阅读 · 0 评论 -
《ExtJS2.0实用简明教程》之可编辑表格EditorGridPanel
可编辑表格是指可以直接在表格的单元格对表格的数据进行编辑，ExtJS中的可编辑表格由类Ext.grid.EditorGridPanel表示，xtype为editorgrid。使用EditorGridPanel与使用普通的GridPanel方式一样，区别只是在定义列信息的时候，可以指定某一列使用的编辑即可，下面来看一个简单的示例。 Ext.onReady(function(){ var ...2010-02-27 10:22:17 · 290 阅读 · 0 评论 -
《ExtJS2.0实用简明教程》之可编辑表格EditorGridPanel
可编辑表格是指可以直接在表格的单元格对表格的数据进行编辑，ExtJS中的可编辑表格由类Ext.grid.EditorGridPanel表示，xtype为editorgrid。使用EditorGridPanel与使用普通的GridPanel方式一样，区别只是在定义列信息的时候，可以指定某一列使用的编辑即可，下面来看一个简单的示例。 Ext.onReady(function(){ var d...2010-03-01 09:31:22 · 144 阅读 · 0 评论 -
《ExtJS2.0实用简明教程》之Store
Store可以理解为数据存储器，可以理解为客户端的小型数据表，提供缓存等功能。在ExtJS中，GridPanel、ComboBox、DataView等控件一般直接与Store打交道，直接通过store来获得控件中需要展现的数据等。一个Store包含多个Record，同时Store又包含了数据来源，数据解析器等相关信息，Store通过调用具体的数据解析器(DataReader)来解析指定类型或格式的...2010-03-01 09:42:48 · 182 阅读 · 0 评论 -
《ExtJS2.0实用简明教程》之DataReader
DataReader表示数据读取器，也就是数据解析器，其负责把从服务器或者内存数组、xml文档中获得的杂乱信息转换成ExtJS中的记录集Record数据对象，并存储到Store里面的记录集数组中。 数据解析器的基类由Ext.data.DataReader定义，其它具体的数据解析器都是该类的子类，ExtJS中提供了读取二维数组、JSon数据及Xml文档的三种数据解析器，分别用于把内存...2010-03-01 09:45:20 · 129 阅读 · 0 评论 -
《ExtJS2.0实用简明教程》之DataProxy与自定义Store
DataProxy字面解释就是数据代理，也可以理解为数据源，也即从哪儿或如何得到需要交给DataReader解析的数据。数据代理（源）基类由Ext.data.DataProxy定义，在DataProxy的基础，ExtJS提供了Ext.data.MemoryProxy、Ext.data.HttpProxy、Ext.data.ScriptTagProxy等三个分别用于从客户端内存数据、Ajax读取服务...2010-03-01 09:47:25 · 150 阅读 · 0 评论 -
《ExtJS2.0实用简明教程》之Fit布局
Column列布局由Ext.layout.ColumnLayout类定义，名称为column。列布局把整个容器组件看成一列，然后往里面放入子元素的时候，可以通过在子元素中指定使用columnWidth或width来指定子元素所占的列宽度。columnWidth表示使用百分比的形式指定列宽度，而width则是使用绝对象素的方式指定列宽度，在实际应用中可以混合使用两种方式。看下面的代码： Ext.o...2010-02-26 15:04:57 · 145 阅读 · 0 评论 -
ExtJS2.0实用简明教程》之Column列布局
Column列布局由Ext.layout.ColumnLayout类定义，名称为column。列布局把整个容器组件看成一列，然后往里面放入子元素的时候，可以通过在子元素中指定使用columnWidth或width来指定子元素所占的列宽度。columnWidth表示使用百分比的形式指定列宽度，而width则是使用绝对象素的方式指定列宽度，在实际应用中可以混合使用两种方式。看下面的代码： Ext.o...2010-02-26 14:55:43 · 137 阅读 · 0 评论 -
《ExtJS2.0实用简明教程》之Border区域布局
Border布局由类Ext.layout.BorderLayout定义，布局名称为border。该布局把容器分成东南西北中五个区域，分别由east，south, west，north, cente来表示，在往容器中添加子元素的时候，我们只需要指定这些子元素所在的位置，Border布局会自动把子元素放到布局指定的位置。看下面的代码： Ext.onReady(function(){ new ...2010-02-26 14:32:31 · 106 阅读 · 0 评论 -
《ExtJS2.0实用简明教程》之ExtJS版的Hello
面我们写一个最简单的ExtJS应用，在hello.html文件中输入下面的代码： <html xmlns="http://www.w3.org/1999/xhtml" > <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title2010-02-22 17:26:26 · 115 阅读 · 0 评论 -
ExtJS2.0实用简明教程》之ExtJS的组件
Ext2.0对框架进行了非常大的重构，其中最重要的就是形成了一个结构及层次分明的组件体系，由这些组件形成了Ext的控件，Ext组件是由 Component类定义，每一种组件都有一个指定的xtype属性值，通过该值可以得到一个组件的类型或者是定义一个指定类型的组件。ExtJS中的组件体系由下图所示： 组件大致可以分成三大类，即基本组件、工具栏组件、表单及元素组件。基本组件有： xtype ...2010-02-25 17:43:04 · 107 阅读 · 0 评论 -
《ExtJS2.0实用简明教程》之组件的使用
组件可以直接通过new 关键子来创建，比如控件一个窗口，使用new Ext.Window()，创建一个表格则使用new Ext.GridPanel()。当然，除了一些普通的组件以外，一般都会在构造函数中通过传递构造参数来创建组件。组件的构造函数中一般都可以包含一个对象，这个对象包含创建组件所需要的配置属性及值，组件根据构造函数中的参数属性值来初始化组件。比如下面的例子： <script&g...2010-02-25 17:59:33 · 122 阅读 · 0 评论 -
《ExtJS2.0实用简明教程》之Panel
面板Panel是ExtJS控件的基础，很高级控件都是在面板的基础上扩展的，还有其它大多数控件也都直接或间接有关系。应用程序的界面一般情况下是由一个一个的面板通过不同组织方式形成。面板由以下几个部分组成，一个顶部工具栏、一个底部工具栏、面板头部、面板尾部、面板主区域几个部分组件。面板类中还内置了面板展开、关闭等功能，并 提供一系列可重用的工具按钮使得我们可以轻松实现自定义的行为，面板可以放入其它任何...2010-02-25 18:25:52 · 118 阅读 · 0 评论 -
《ExtJS2.0实用简明教程》之视图区ViewPort
在前面的示例中，为了显示一个面板，我们需要在页面上添加一个div，然后把 Ext控件渲染到这个div上。VeiwPort代表整个浏览器显示区域，该对象渲染到页面的body区域，并会随着浏览器显示区域的大小自动改变，一个 页面中只能有一个ViewPort实例。看下面的代码： Ext.onReady(function(){ new Ext.Viewport({ enableTabScr...2010-02-26 09:58:38 · 104 阅读 · 0 评论 -
《ExtJS2.0实用简明教程》之窗口基本应用
ExtJS中窗口是由Ext.Window类定义，该类继承自Panel，因此窗口其实是一种特殊的面板Panel。窗口包含了浮动、可拖动、可关闭、最大化、最小化等特性。看下面的代码： var i=0; function newWin() { var win=new Ext.Window({title:"窗口"+i++, width:400, height:300,...2010-02-26 12:20:04 · 118 阅读 · 0 评论 -
ExtJS2.0实用简明教程》之窗口分组
窗口是分组进行管理的，可以对一组窗口进行操作，默认情况下的窗口都在默认的组 Ext.WindowMgr中。窗口分组由类Ext.WindowGroup定义，该类包括bringToFront、getActive、 hideAll、sendToBack等方法用来对分组中的窗口进行操作。 看下面的代码： var i=0,mygroup; function newWin() { va...2010-02-26 13:19:57 · 125 阅读 · 0 评论 -
《ExtJS2.0实用简明教程》之对话框
由于传统使用alert、confirm等方法产生的对话框非常古板，不好看。因此，ExtJS提供了一套非常漂亮的对话框，可以使用这些对话框代替传统的alert、confirm等，实现华丽的应用程序界面。Ext的对话框都封装在Ext.MessageBox类，该类还有一个简写形式即Ext.Msg，可以直接通过Ext.MessageBox或Ext.Msg来直接调用相应的对话框方法来显示Ext对话框。看下面...2010-02-26 14:05:41 · 121 阅读 · 0 评论 -
ExtJS2.0实用简明教程》之布局概述
所谓布局就是指容器组件中子元素的分布、排列组合方式。Ext的所有容器组件都支持而局操作，每一个容器都会有一个对应的布局，布局负责管理容器组件中子元素的排列、组合及渲染方式等。 ExtJS的布局基类为Ext.layout.ContainerLayout，其它布局都是继承该类。ExtJS的容器组件包含一个layout及layoutConfig配置属性，这两个属性用来指定容器使用的布局及布...2010-02-26 14:17:58 · 141 阅读 · 0 评论 -
《ExtJS2.0实用简明教程》之TreePanel基本使用
在应用程序中，我们经常会涉及到要显示或处理树状结构的对象信息，比如部门信息、地区信息，或者是树状的菜单信息，操作系统中的文件夹信息等。 对于传统的html页面来说，要自己实现显示树比较困难，需要写很多的javascript，特别是对于基于Ajax异步加载的树来说，不但涉及到Ajax数据加载及处理技术，还需要考虑跨浏览器支持等，处理起来非常麻烦。ExtJS中提供了现存的树控件，通过这些控件可以在B...2010-03-02 11:05:20 · 204 阅读 · 0 评论