ExtJS_3.0
关注
分享
扫一扫
文章平均质量分 60
yue2008
这个作者很懒，什么都没留下…
展开
-
ExtJS组件图
ExtJS组件图：原创 2010-05-18 00:07:23 · 133 阅读 · 0 评论 -
水平盒布局（HBoxLayout）
Ext.layout.HBoxLayout扩展自Ext.layout.BoxLayout，其xtype值为hbox。 主要配置项： align：子元素在垂直方向的对齐方式，可选值有top、middle、stretch(垂直伸展)、stretchmax，默认为top。 flex：水平伸缩。将面板的宽减去不伸缩的子元素的宽后剩余的宽度等分成【flex和值】份，子元素伸缩后占的份数...原创 2010-05-18 01:51:35 · 1022 阅读 · 0 评论 -
垂直盒布局（VBoxLayout）
Ext.layout.VBoxLayout扩展自Ext.layout.BoxLayout，其xtype值为vbox。 主要配置项： align：子元素在水平方式的对齐方式，可选值有left、center、stretch(水平伸展)、stretchmax，默认为left。 flex：垂直伸缩。将面板的body高减去不伸缩的子元素的高后剩余的高度等分成【flex和值】份，子元素伸...原创 2010-05-18 01:54:54 · 1062 阅读 · 0 评论 -
Ext.Viewport
Ext.Viewport代表浏览器窗口的整个显示区域，将document body作为渲染对象，它会根据浏览器窗口的大小自动调整自身的尺寸。 在一个页面中只允许出现一个Viewport实例，没有提供对滚动条的支持。 Ext.onReady(function(){ var accordion = new Ext.Panel({ title: "功能分组", layout: "...原创 2010-05-18 02:00:26 · 450 阅读 · 0 评论 -
Ext.TabPanel
TabPanel不显示面板的标题和头部工具条。 1、主要配置项： activeTab：初始激活的tab，索引或者id值，默认为none autoTabs：是否自动将带有'x-tab'样式类的div转成tabs添加到TabPanel中，默认为false。 当该配置项设为true时，需要设置deferredRender为false，还必须使用appl...原创 2010-05-20 14:28:18 · 569 阅读 · 0 评论 -
树组件：主要配置项、属性、方法
1、Ext.tree.TreePanel 主要配置项： root：树的根节点。 rootVisible：是否显示根节点，默认为true。 useArrows：是否在树中使用Vista样式箭头，默认为false。 lines：是否显示树线，默认为true。 loader：树节点...2010-05-21 15:01:36 · 468 阅读 · 0 评论 -
树组件：普通树范例
1、范例包含以下功能点： 节点包含复选框 单击节点触发事件 取得所有选中的节点（包括节点获取焦点和复选框选中两种情况） 2、范例源码Ext.onReady(function(){ Ext.BLANK_IMAGE_URL = "../widgets/ext-3.0/resources/images/default/s.gif"; Ext....原创 2010-05-21 15:26:15 · 162 阅读 · 0 评论 -
树组件：异步树范例
1、范例主要展示以下功能点： 树节点通过请求服务器URL地址获得 请求附加自定义参数值 重新加载树节点的子节点 节点附件自定义属性值 2、范例源码Ext.onReady(function(){ Ext.BLANK_IMAGE_URL = "../widgets/ext-3.0/resources/images/default/...原创 2010-05-21 15:34:41 · 194 阅读 · 0 评论 -
普通表格：Ext.grid.GridPanel
表格相关组件总图： 1、Ext.grid.GridPanel 主要配置项： store：表格的数据集 columns：表格列模式的配置数组，可自动创建ColumnModel列模式 autoExpandColumn：自动充满表格未用空间的列，参数为列id，该id不能为0 stripeRows：表格是否隔行换色，...2010-05-24 15:48:29 · 245 阅读 · 0 评论 -
普通表格范例
主要演示以下功能： 包含复选框列、行号列 自定义单元格的渲染 定制表格视图 各种选择模式：单元格、行、复选框 范例源码：var datas = [[1,"张三",24,"Y",new Date(1986,06,09)], [2,"李四",30,"N",new Date(1980,09,13)], [3,"王五",28,"Y",new Date(1原创 2010-05-24 16:14:37 · 248 阅读 · 0 评论 -
表格数据分组：Ext.grid.GroupingView
1、Ext.grid.GroupingView 主要配置项： enableGroupingMenu：是否在表头菜单中进行分组控制，默认为true groupByText：表头菜单中分组控制的菜单文字，默认为'Group By This Field' enableNoGroups：是否允许用户关闭分组功能，默认为true...2010-05-24 20:46:52 · 324 阅读 · 0 评论 -
可编辑表格：Ext.grid.EditorGridPanel
1、Ext.grid.EditorGridPanel 主要配置项： clicksToEdit：设置点击单元格进入编辑模式的点击次数，默认为2 autoEncode：是否自动编码/解码HTML内容，默认为false selModel：默认为Ext.grid.CellSelectionModel 主要方法： ...原创 2010-05-24 20:59:03 · 630 阅读 · 0 评论 -
属性表格：Ext.grid.PropertyGrid
1、Ext.grid.PropertyGrid 主要配置项： customEditors：自定义编辑器。内置编辑器有string、date、number、boolean source：表格要显示的数据对象 主要方法： getSource()：取得数据源对象 setSource( Obje...原创 2010-05-24 21:03:22 · 463 阅读 · 0 评论 -
表单组件_v2.2（一）
1、Ext.form.Action 配置项： success：执行成功后回调的函数，包括两个参数：form和action failure：执行失败后回调的函数，包括两个参数：form和action method：表单的提交方式，有效值包括GET、POST params：传递到请求中的参数 url：...2010-10-07 21:48:14 · 119 阅读 · 0 评论 -
表单组件_v2.2（二）
1、Ext.form.Hidden 2、Ext.form.Label 配置项： html： text： 3、Ext.form.TextField 配置项： allowBlank：是否允许为空，默认为true blankText：空验证失败后显示的提示信息 emp...原创 2010-10-07 21:57:33 · 243 阅读 · 0 评论 -
表单组件_v2.2（三）
本范例展示如何使用表单的各种组件。下拉框组件展示了5种使用范例：普通下拉框、绑定HTML组件的下拉框、树形下拉框、分页下拉框、多选下拉框等。 Ext.onReady(function(){ Ext.BLANK_IMAGE_URL = "/widgets/ext-2.2/resources/images/default/s.gif"; Ext.QuickTips.ini...原创 2010-10-07 22:21:41 · 313 阅读 · 0 评论 -
边框布局（BorderLayout）
Ext.layout.BorderLayout扩展自Ext.layout.ContainerLayout，其xtype值为border。此布局将容器分为5个部分，分别是east、south、west、north、center。其中，center是必须的。 子面板配置项： region：设置子面板所在区域。 new Ext.Panel({ renderTo: "div2", fr...原创 2010-05-18 01:48:48 · 1363 阅读 · 0 评论 -
表格布局（TableLayout）
Ext.layout.TableLayout扩展自Ext.layout.ContainerLayout，其xtype值为table。 布局的配置项： columns：设置表格布局的列数。 子面板的配置项： rowspan：跨行的数量。 colspan：跨列的数量。 new Ext.Panel({ renderTo: "div2", fr...原创 2010-05-18 01:46:07 · 621 阅读 · 0 评论 -
列布局（ColumnLayout）
Ext.layout.ColumnLayout扩展自Ext.layout.ContainerLayout，其xtype值为column。 子面板的主要配置项： columnWidth：以百分比为单位的列宽，必须是大于0小于1的小数，所有列的columnWidth值相加必须等于1。 width：以像素为单位的固定宽度。 百分比计算的基础宽度是父容器的宽度减去固定...原创 2010-05-18 01:43:30 · 723 阅读 · 0 评论 -
Ext.MessageBox的使用
Ext.MessageBox是一个工具类，它继承自Object对象，用来生成各种风格的信息提示对话框，Ext.Msg是该类的别名，使用Ext.MessageBox和使用Ext.Msg有相同的效果，而后者提供了更简短的调用方式。 1、Ext.MessageBox.alert() 调用格式：Ext.MessageBox.alert(String title, String msg, ...原创 2010-05-18 00:11:58 · 1611 阅读 · 0 评论 -
Ext.ProgressBar的使用
1、手工模式的进度条 调用格式：updateProgress([Float value], [String text]) 参数说明： value：0~1之间的数字，默认为0。 text：进度条上显示的文字。 范例：Ext.onReady(function(){ var obj = new Ext.ProgressBa...原创 2010-05-18 00:29:11 · 353 阅读 · 0 评论 -
公共信息
配置项： applyTo：将目标元素的父节点作为新组件的容器 renderTo：将目标元素作为新组件的容器 公共属性、方法： Ext.BLANK_IMAGE_URL = "../widgets/ext-3.0/resources/images/default/s.gif"; //信息提示功能 //四种效果：qtip、title、un...原创 2010-05-18 00:33:49 · 103 阅读 · 0 评论 -
按钮组件（Ext.Button、Ext.SplitButton）
1、Ext.Button的主要配置项： text：按钮上显示的文字 handler：按钮单击后调用的函数，按钮本身作为参数传入到函数 function onToolbarButton(btn){ alert(btn.id); } menu：按钮菜单。 arrowAlign：箭头...原创 2010-05-18 00:37:26 · 726 阅读 · 0 评论 -
菜单（Ext.menu.Menu）
1、Ext.menu.Menu的主要配置项： shadow：是否显示阴影或者阴影显示方式，显示方式有sides、frame、drop，默认为true即sides。 items：菜单项数组。 菜单项主要配置项： text：菜单项显示的文字 iconCls：菜单项显示的图标 ...原创 2010-05-18 00:41:56 · 457 阅读 · 0 评论 -
面板（Ext.Panel）
1、主要配置项： applyTo：在目标元素之后追加组件。 renderTo：将目标元素作为新组件的容器。 frame：是否渲染面板，默认为false。 layout：面板的布局类型。 layoutConfig：被选布局的配置项。 title：设置面板头部的标题信息。 header：设置是否创建面板头部，默认为false。 ...原创 2010-05-18 00:45:01 · 671 阅读 · 0 评论 -
窗口（Ext.Window）
Ext.Window扩展自Ext.Panel，其xtype值为window。 1、主要配置项： closable：是否允许关闭窗口，默认为true。 closeAction：关闭窗口的动作，包括以下两种： close：从DOM删除窗口，销毁窗口及其所属组件，窗口不再可用，重新显示需要调用show方法。此为默认值。 hide：通...原创 2010-05-18 01:04:09 · 598 阅读 · 0 评论 -
工具条（Ext.Toolbar）
当在工具条中同时出现Menu和Element时，会导致Menu失灵。 1、Ext.Toolbar的常用方法： addButton() addElement() addField() addFill() addSeparator() addText() add() 2、普通工具条Ext.onReady(func...原创 2010-05-18 01:13:34 · 325 阅读 · 0 评论 -
布局（Layout）
Ext.layout.ContainerLayout提供了所有布局类的基本功能。此为默认布局。 布局总图：原创 2010-05-18 01:18:26 · 192 阅读 · 0 评论 -
自适应布局（FitLayout）
Ext.layout.FitLayout是布局的基础类，其xtype值为fit。使用fit布局将使面板子元素自动充满容器，如果在当前容器中存在多个子面板则只有第一个会被显示。 new Ext.Panel({ renderTo: "div1", frame: true, layout: "fit", width: 400, height: 200, title: "自...原创 2010-05-18 01:21:30 · 706 阅读 · 0 评论 -
折叠布局（AccordionLayout）
Ext.layout.Accordion扩展自Ext.layout.FitLayout布局，其xtype值为accordion。 主要配置项： activeOnTop：是否保持展开的子面板处于父面板的顶端，默认为false。 animate：是否在展开或收缩子面板时使用滑动方式，默认为false。 fill：设置子面板是否自动调整高度充满父面板的剩余空间，默认...原创 2010-05-18 01:24:26 · 423 阅读 · 0 评论 -
卡片式布局（CardLayout）
Ext.layout.CardLayout扩展自Ext.layout.FitLayout布局，其xtype值为card。切换子面板的唯一途径是调用setActiveItem方法。 var panel = new Ext.Panel({ renderTo: "div3", frame: true, layout: "card", title: "卡片式布局（CardLayou...原创 2010-05-18 01:27:27 · 2049 阅读 · 1 评论 -
锚点布局（AnchorLayout）
Ext.layout.AnchorLayout是根据容器大小为其所包含的子面板进行定位的布局，其xtype值为anchor。 主要配置项： anchorSize：父容器提供 anchor：子容器提供 加入到使用anchor布局面板中的子面板都支持一个anchor配置项，它是一个包含两个值的字符串，水平值和垂直值。其有效值： 百分比： 100% 50% ...原创 2010-05-18 01:31:30 · 1089 阅读 · 0 评论 -
绝对位置布局（AbsoluteLayout）
Ext.layout.AbsoluteLayout扩展自Ext.layout.AnchorLayout布局，其xtype值为absolute。根据子面板中配置的x/y坐标进行定位，并且坐标值支持使用固定值和百分比两种形式。 new Ext.Panel({ renderTo: "div2", frame: true, layout: "absolute", title: "绝...原创 2010-05-18 01:34:07 · 665 阅读 · 0 评论 -
表单布局（FormLayout）
Ext.layout.FormLayout是为表单特殊设计的布局，其xtype值为form。 主要配置项： labelAlign：字段标签的对齐方式，默认为left。 labelPad：字段标签与字段之间的间距，默认为5。 labelWidth：字段标签的宽度，默认为100。 hideLabels：是否隐藏字段标签，默认为false。 Ext...原创 2010-05-18 01:40:15 · 3957 阅读 · 0 评论 -
表单组件_v2.2（四）
1、下拉框组件支持中间模糊查询function listener_ComboboxBeforeQuery(e){ var combo = e.combo; try{ var value = e.query; combo.lastQuery = value; combo.store.filterBy(function(record,id){ ...原创 2011-01-30 15:51:33 · 162 阅读 · 0 评论