摘要: 1.面板 (1)类结构 Ext.Base Ext.AbstractComponent Ext.Component Ext.container.AbstractContainer Ext.container.Container Ext.panel.AbstractPanel Ext.panel.Panel (2)常见子类 Ext.window.Window Ext.form.panel ---form的panel Ext.panel.Table ---grid的panel Ext.tab.Panel ---标签页的panel Ext.menu... 阅读全文
posted @ 2013-04-27 18:15 赵雪丹 阅读(508) 评论(0) 推荐(0) 编辑
摘要: 1.关于图表 图表的轴(axes) (1) 数值轴 Ext.chart.axis.Numeric (2) 时间轴 Ext.chart.axis.Time (3) 分类轴 Ext.chart.axis.Category (4) 仪表轴 Ext.chart.axis.Gauge 图表的类型 (1) 折线图 Ext.chart.series.Line (2) 柱形图 Ext.chart.series.Column (3) 饼状图 Ext.chart.series.Pie (4) 条形图 Ext.chart.series.Bar (5) 面积图 Ext.chart.series.Ar... 阅读全文
posted @ 2013-04-27 18:15 赵雪丹 阅读(823) 评论(0) 推荐(0) 编辑
摘要: 1.根类 Ext.form.Basic 提供了表单组件,字段管理,表单提交,数据加载的功能2.表单的容器 Ext.form.panel 容器自动关联 Ext.form.Basic的实例对象,更方便的进行字段的配置 重要属性 defautType : "" (设置默认子项的xtype)3.数据交互和加载 Ext.form.action.Action(两种表单自身的提交方式) Ext.from.action.Submit Ajax方式提交 Ext.form.action.StandardSubmit 原始鼻癌单提交方法 Ext.form,action.DirectLoad E. 阅读全文
posted @ 2013-04-27 18:14 赵雪丹 阅读(319) 评论(0) 推荐(0) 编辑
摘要: 1. 类结构 Ext.panel.Panel Ext.panel.Table Ext.tree.Panel --- 他是和grid完全一样的2. 主要配置项 title 标题 width 宽 height 高 renderTo 渲染到什么地方 root 控制根节点(Ext.data.Model/Ext.data.NodeInterface) animate : Boolean 控制收起和展开是发有动画效果 store: store 数据集合 rootVisible : false,//控制显隐的属性 重要事件 itemclick:function(tree,record... 阅读全文
posted @ 2013-04-27 18:13 赵雪丹 阅读(458) 评论(0) 推荐(0) 编辑
摘要: 1. 表格面板类Ext.grid.Panel基本属性。(两个别名xtype:gridpanel, grid) 重要的配置参数: (1)columns : Array 列模式(Ext.grid.column.Columnxtype: gridcolumn) 列里面的常用配置参数: text : String 列的标题 默认是"" dataIndex : String 和Model的列一一对应的 field: {} //配合插件使用,告诉插件在那一列起作用 xtype:默认为gridcolumn renderer : function(value) //可以列里面值显示... 阅读全文
posted @ 2013-04-27 18:12 赵雪丹 阅读(945) 评论(0) 推荐(0) 编辑
摘要: 从这个图中我们可以很清楚的看到M 、V、C在ExtJS4.0里面所对应数据类型。靠右边是对应的代码结构。下描述一下这model、store、view、controller以及application这几者之间的关系。(1)application:它是MVC的入口,用来告诉ExtJS到那里去找对应js文件以及启动加载controller与view连个模块的代码。//打开动态加载js功能Ext.Loader.setConfig({enabled:true});Ext.application({name : 'AM',//应用的名字 (根) 利用MVC时这时定义的包路径需要与命名空间的 阅读全文
posted @ 2013-04-27 18:11 赵雪丹 阅读(281) 评论(0) 推荐(0) 编辑
摘要: 1. Ext事件机制(1)事件的3中绑定方式HTML/DHTMLDOMEXTJS(2)Ext.util.Observable 事件的基类它为所有支持事件机制的extjs组建提供事件的支持。如果我们自己创建新的组建需要有时间的支持那么我们就继承它。事件的分类:标准事件[键盘按钮按下,鼠标的单击双击,滑过滑动]。业务事件[当面板收起的时候触发,当组建被销毁的时候触发,当每一个对象的属数值不为空的时候触发]。(3)addManagedListener 收管制的监听它是由调用的组建管理的,当组建执行了销毁命令的时候所有被组建管制的事件全部销毁。(4)relayEvents 事件的分发和传播(控制实现事 阅读全文
posted @ 2013-04-27 18:07 赵雪丹 阅读(936) 评论(0) 推荐(0) 编辑
摘要: 1. extjs4.0对原生javaScript功能进行了扩展(API中的Utilities模块中的NativeExtensions) Utilities:常用的一些工具处理类 Native Extensions Ext.Array Ext.Number Ext.Object Ext.String Ext.JSON Ext.Date Ext.Function具体扩展了那些,请参照具体的API说明,扩展的原理eg:var Person = {name:'yfc',age:26}; //alert(Person['name']); //extjs4.0提供getKe 阅读全文
posted @ 2013-04-27 18:06 赵雪丹 阅读(658) 评论(0) 推荐(0) 编辑
摘要: 1. 组件component : 能够以图形化形式呈现界面的类,其中还可以分为容器组件与元件组件。容器组件:能够包含其它容器或者元件组件的类,其是进行单元化组件开发的基础元件组件:能图形化形式表现一个片面功能的组件,其不仅在实现了原有传统WEB程序的现有组件,而且还扩展了许多实用的组件,如刻度器、日历、树形列表等。2. 类 提供功能的非图形可形的类,它们为图形类提供了有力的支持 按其功能可分为:数据支持类(Data)、拖放支持类(DD)、布局支持类(layout)、本地状态存储支持类(state)、实用工具类(Util)。 密封类:不能被扩展的类 原型类:扩展了javascript标准类库中的 阅读全文
posted @ 2013-04-27 18:03 赵雪丹 阅读(346) 评论(0) 推荐(0) 编辑
摘要: 1.Layouts1)Ext.layout.container.Border layout : 'border' 表示我们使用了Border布局,这种布局方式称为边界布局,它将页面分隔成为:west,east,south,north,center这五个部分,我们在items里面使用region参数为它组织定义具体的位置。 north和south部分只能设置高度(height),west和east部分只能设置宽度(width)。north south west east区域变大了,center区域就变小了。 参数 split:true 可以拖动除了center四个区域的大小。 参 阅读全文
posted @ 2013-04-27 18:02 赵雪丹 阅读(539) 评论(0) 推荐(0) 编辑
摘要: 網上有好多關於Grid分頁的,各種語言都有,但大部分都是一樣的,都只是講了Grid分頁的語法,很少說到如何和後臺的數據庫交互,查出數據,同樣剛接觸Extjs,希望和菜鳥級別的兄弟姐妹們,共同進步。前臺代碼:varitemsPerPage=2;varstore=Ext.create('Ext.data.Store',{autoLoad:{start:0,limit:itemsPerPage},fields:['AA001','AA002','AA003','AA004','AA005','AA 阅读全文
posted @ 2013-04-27 17:44 赵雪丹 阅读(283) 评论(0) 推荐(0) 编辑
摘要: 希望Ext的表格能自适应外层的div大小,但Ext的Grid构造函数的width、height项不支持100%的设置方式,所以改用以下方式初始化Grid:width: Ext.get("content").getWidth(),height: Ext.get("content").getHeight(),<div id="content"> <div id="grid-example"></div><div>#content {width: 100%;height: 阅读全文
posted @ 2013-04-27 17:41 赵雪丹 阅读(2942) 评论(0) 推荐(0) 编辑
摘要: Ext4.0 自带的Ext.ux.RowEditing还不够完善,随手写个ux来用下,v1.4 2011-09-12 变更内容:1.重构,修复不少bug以及合并/新增一些配置项(具体看附件中的文档)2.支持jsduck生成文档 (https://github.com/senchalabs/jsduck)v1.0 2011.04.27 变更内容:1.增加canceledit事件2.增加startAdd方法,方便crud表格的添加操作3.添加点击取消按钮后,自动重置或删除记录的功能v1.1 2011.05.03 变更内容:1.startAdd方法增加position参数,修复autoSync设值的 阅读全文
posted @ 2013-04-27 17:37 赵雪丹 阅读(833) 评论(0) 推荐(0) 编辑
摘要: var textfieldName = new Ext.form.TextField ({ id:"textfieldName", allowBlank:false,//默认是true,如果是false,就是不允许空 //假如不为空时,定义提示信息 默认的提示信息是:This field is required //要使提示内容出现,需要添加 Ext.QuickTips.init(); blankText:"请输入数据", disabled:false,//默认是false emptyText:"请正确输入数据",//默认是null 阅读全文
posted @ 2013-04-27 17:35 赵雪丹 阅读(714) 评论(0) 推荐(0) 编辑
摘要: 给grid添加RowEditing:[javascript]var rowEditing = Ext.create('Ext.grid.plugin.RowEditing', { pluginId:'rowEditing', saveBtnText: '保存', cancelBtnText: "取消", autoCancel: false, clicksToEdit:2<span style="white-space:pre"> </span>//双击进行修改 })然后在grid里面 阅读全文
posted @ 2013-04-27 17:33 赵雪丹 阅读(613) 评论(0) 推荐(0) 编辑
摘要: var mk = new Ext.LoadMask(tree.id, { msg: '正在更新数据,请稍候!', removeMask: true //完成后移除 }); mk.show(); //显示 Ext.Ajax.request({ url: 'roleAction.evi', // 发送get请求. method: 'GET', success: function() { mk.hide(); //关闭 }, failure: function() { mk.hide(); } }); var waitMask = new Ext.Lo 阅读全文
posted @ 2013-04-27 17:30 赵雪丹 阅读(482) 评论(0) 推荐(0) 编辑
摘要: Grid是Ext框架中一个重要的组成部分。一般建立Grid主要实现数据的增删改查。 建立一个Grid Grid一般有三个主要的内容,ds,cm,GridPanel var ds = new Ext.data.Store(); var cm = new Ext.grid.ColumnModel(); var grid = new Ext.grid.GridPanel(); 如果要页面载入时,Grid不显示,事件触发查询并建立Grid显示。很简单,将GridPa... 阅读全文
posted @ 2013-04-27 17:29 赵雪丹 阅读(1075) 评论(0) 推荐(0) 编辑