- Ext.form.TimeField:
- 配置项:
- maxValue:列表中允许的最大时间
- maxText:当时间大于最大值时的错误提示信息
- minValue:列表中允许的最小时间
- minText:当时间小于最小值时的错误提示信息
- increment:两个相邻选项间的时间间隔,默认为15分钟
- format:显示格式,默认为“g:i A”。一般使用“H:i:s”
- H:带前缀0的24小时
- i:带前缀0的分钟
- s:带前缀0的秒
- invalidText:当时间值非法时显示的提示信息
- altFormats:多个时间输入格式组成的字符串,不同的格式之间使用“|”进行分割
- Ext.form.FieldSet
- animCollapse:动画折叠,默认为false
- checkboxToggle:设置是否显示字段集的checkbox选择框,默认为false
- checkboxName:指定字段集中用于展开或隐藏字段集面板的checkbox的名字,该属性只有在checkboxToggle为true时生效
- labelWidth:字段标签的宽度,可以级联到子容器
- layout:布局,默认为form
- Ext.form.DateFied
- maxValue:允许选择的最大日期
- maxText:当日期大于最大值时的错误提示信息
- minValue:允许选择的最小时间
- minText:当日期小于最小值时的错误提示信息
- format:日期显示格式,默认为“m/d/y”,一般使用“Y-m-d”
- Y:四位年份
- m:带前缀0的月份
- d:带前缀0的日期
- y:两位年份
- n:不带前缀0的月份
- j:不带前缀0的日期
- w:星期的数字,0表示星期日,1代表星期一
- showToday:是否显示今天按钮,默认为true
- altFormats:多个日期输入格式组成的字符串,不同的格式之间使用“|”进行分割,默认值为'm/d/Y|n/j/Y|n/j/y|m/j /y|n/d/y|m/j/Y|n/d/Y|m-d-y|m-d-Y|m/d|m-d|md|mdy|mdY|d|Y-m-d'
- disabledDates:禁止选择的日期组成的数组
- disabledDatesText:选择禁选日期时显示的提示信息
- disabledDays:禁止选择的星期组成的数组,0代表星期日,1代表星期一
- disabledDaysText:选择禁选星期时显示的提示信息
- invalidText:当日期值非法时显示的提示信息
- 方法:
- getValue():取得日期值
- Ext.form.ComboBox
- displayField:被显示在下拉框中的字段名
- editable:是否可编辑,默认为true
- forceSelection:输入值是否严格为待选列表中存在的值。如果输入不存在的值,会自动选择第一个最接近的值。
- hiddenName:隐藏字段的名字,如果提供该参数则一个隐藏字段将被创建,用来存储所选值,当表单提交时在服务器端可以通过该名字取得列表中的所选值
- listWidth:下拉列表的宽度
- minListWidth:下拉列表的最小宽度,默认为70像素
- loadingText:当下拉框加载数据时显示的提示信息,只有当mode='remote'时才会生效
- maxHeight:下拉列表框的最大高度,默认为300像素
- minChars:下拉列表框自动选择前用户需要输入的最小字符数量。mode='remote'默认为4,mode='local'默认为0
- mode:下拉列表框的数据读取模式。remote读取远程数据,local读取本地数据
- pageSize:下拉列表框的分页大小。该项设置只在mode='remote'时生效
- queryParam:查询的名字,默认为'query',将被传递到查询字符串中
- allQuery:一个发往服务器用来查询全部信息的查询字符串,默认为空字符串''
- selectOnFocus:当获得焦点时立刻选择一个已存在的列表项。默认为false,此项只有在editable=true时才会生效
- store:列表框绑定的数据源
- transform:将页面中已存在的元素转换为组合框
- lazyInit:延时初始化下拉列表,默认为true
- lazyRender:延时渲染,默认为false
- triggerAction:设置单击触发按钮时执行的默认操作,有效值包括all和query,默认为query,如果设置为all则会执行allQuery中设置的查询
- typeAhead:设置在输入过程中是否自动选择匹配的剩余部分文本(选择第一个满足条件的),默认为false
- value:初始化组合框中的值
- valueField:组合框的值字段
- valueNotFoundText:值不存在时的提示信息
- tpl:Ext模板字符串或模板对象,可以通过该配置项自定义下拉列表的显示方式
- 方法:
- clearValue():清空字段当前值
- doQuery( String query, Boolean forceAll ):
- getValue():
- getStore():
- setValue( String value ):
- Ext.from.RadioGroup
- allowBlank:
- blankText:
- Ext.form.Radio;
- getGroupValue():
- setValue( value {String/Boolean} ):
- Ext.form.CheckboxGroup
- allowBlank:是否允许不选择,默认为true
- blankText:
- columns:显示的列数,可选值包括:固定值auto、数值、数组(整数、小数)
- items:对象数组
- vertical:是否垂直方向显示对象,默认为false
- Ext.form.Checkbox
- boxLabel:复选框的文字描述
- checked:复选框是否被选择,默认为false
- handler:当checked值改变时触发的函数,函数包含两个参数:checkbox、checked
- inputValue:
- 方法:
- getValue():返回复选框的checked状态
- setValue( Boolean/String checked ):
- Ext.form.NumberField
- allowDecimals:是否允许输入小数,默认为true
- allowNegative:是否允许输入负数,默认为true
- baseChars:输入的有效数字集合,默认为'0123456789'
- decimalPrecision:数字的精度,默认保留小数点后2位
- decimalSeparator:十进制分隔符,默认为'.'
- maxValue:允许输入的最大数值
- maxText:超过最大值之后的提示信息
- minValue:允许输入的最小数值
- minText:超过最小值之后的提示信息
- nanText:输入非有效数值之后的提示信息
- Ext.form.TextArea
- preventScrollbars:是否禁止出现滚动条,默认为false
- Ext.form.TextField
- allowBlank:是否允许为空,默认为true
- blankText:空验证失败后显示的提示信息
- emptyText:在一个空字段中默认显示的信息
- grow:字段是否自动伸展和收缩,默认为false
- growMin:收缩的最小宽度
- growMax:伸展的最大宽度
- inputType:字段类型:默认为text
- maskRe:用于过滤不匹配字符输入的正则表达式
- maxLength:字段允许输入的最大长度
- maxLengthText:最大长度验证失败后显示的提示信息
- minLength:字段允许输入的最小长度
- minLengthText:最小长度验证失败后显示的提示信息
- regex:正则表达式
- regexText:正则表达式验证失败后显示的提示信息
- vtype:验证类型的名字
- alpha:限制只能输入字母
- alphanum:限制只能输入字母和数字
- url
- vtypeText:验证失败时的提示信息
- validator:自定义验证函数
- selectOnFocus:当字段得到焦点时自动选择已存在的文本,默认为false
- Ext.form.Field
- name:字段名
- value:字段的初始化值
- disabled:字段是否不可用,默认为false
- fieldLabel:字段标签说明
- hideLabel:隐藏字段标签,默认为false
- labelSeparator:字段标签与字段之间的分隔符,默认为':'
- labelStyle:字段标签样式
- inputType:默认为text
- invalidClass:默认为x-form-invalid
- invalidText:字段非法文本提示
- msgTarget:错误信息显示的位置,默认为qtip
- qtip:显示一个浮动的提示信息
- title:显示一个浏览器的浮动提示信息
- under:在字段下方显示一个提示信息
- side:在字段右边显示一个提示信息
- readOnly:字段是否只读,默认为false
- validateOnBlur:字段在失去焦点时被验证,默认为true
- 方法:
- clearInvalid():
- getRawValue()
- setRawValue( Mixed value )
- getValue()
- setValue( Mixed value )
- isDirty():字段值在装载后是否被修改过
- isValid( Boolean preventMark ):当前字段值是否合法
- markInvalid( [String msg] )
- validate()
- reset()
- Ext.form.FormPanel
- items:一个元素或元素数组
- buttons:一个按钮配置对象的数组,按钮将被添加到表单页脚中
- buttonAlign:按钮的对齐方式,可选值有left、center、right,默认为center
- labelWidth:表单标签的宽度
- labelAlign:表单标签的对齐方式,可选值有left、top、right,默认为left
- labelSeparator:字段标签与字段之间的分隔符,默认为':'
- minButtonWidth:按钮的最小宽度,默认为75
- 方法:
- getForm() : Ext.form.BasicForm
- load( Object options )
- startMonitoring()
- stopMonitoring()
- Ext.form.BaseicForm
- baseParams:传递到请求中的参数
- method:表单的提交方式,有效值包括GET、POST
- url:表单默认的提交路径
- fileUpload:表单是否进行文件上传
- timeout:表单动作的超时时间,默认为30秒
- trackResetOnLoad:是否在表单初次创建时清楚数据
- 方法:
- doAction( String/Object actionName, [Object options] ):执行一个预订的动作,可用选项包括:
- url:动作提交的路径
- method:表单的提交方式,有效值包括GET、POST
- params:传递到请求中的参数
- headers:
- success:执行成功后回调的函数,包括两个参数:form和action
- failure:执行失败后回调的函数,包括两个参数:form和action
- clientValidation:是否客户端验证
- clearInvalid():清除表单中所有的无效验证信息
- findField( String id ):查找表单字段
- getValues( [Boolean asString] ):
- isDirty():表单数据是否被更改过
- isValid():客户端验证是否成功
- load( Object options ):执行表单读取动作
- loadRecord( Record record ):从一个数据记录中读取数据到表单中
- markInvalid( Array/Object errors ):成批设置表单字段为验证无效
- reset():重置表单
- setValues( Array/Object values ):成批设置表单字段值
- submit( Object options ):执行表单提交动作
- updateRecord( Record record ):持久化表单数据到记录集中
- Ext.form.Action
- success:执行成功后回调的函数,包括两个参数:form和action
- failure:执行失败后回调的函数,包括两个参数:form和action
- method:表单的提交方式,有效值包括GET、POST
- params:传递到请求中的参数
- url:动作提交的路径
- waitMsg:动作执行时显示的等待信息
- 属性:
- Action.CLIENT_INVALID:客户端验证错误
- Action.CONNECT_FAILURE:通信错误
- Action.LOAD_FAILURE:加载数据时,没有包含data属性的字段被返回
- Action.SERVER_INVALID:服务端验证错误
- failureType:错误类型
- result:包含布尔类型的success属性和其他属性,如{success: true, msg: 'ok'}
- type:动作类型,可选值有submit和load
- Ext.form.Action.Submit:返回的信息中要包含一个布尔类型的success属性和一个可选的errors属性
- Ext.form.Action.Load:返回的信息中要包含一个布尔类型的success属性和一个data属性
- Ext.grid.EditorGridPanel
- clicksToEdit:设置点击单元格进入编辑模式的点击次数,默认为2
- autoEncode:是否自动编码/解码HTML内容,默认为false
- selModel:默认为Ext.grid.CellSelectionModel
- 主要方法:
- startEditing( Number rowIndex, Number colIndex ):开始编辑指定单元格
- stopEditing( [Boolean cancel] ):结束编辑操作
- Ext.grid.GroupinView
- enableGroupingMenu:是否在表头菜单中进行分组控制,默认为true
- groupByText:表头菜单中分组控制的菜单文字,默认为'Group By This Field'
- enableNoGroups:是否允许用户关闭分组功能,默认为true
- showGroupsText:在表头菜单中启用分组和禁用分组的菜单文字,默认为'Show in Groups'
- groupTextTpl:用于渲染分组信息的模板,默认为'{text}',常用的可选值有:
- text:列标题:组字段值
- gvalue:组字段的值
- startRow:组行索引
- enableGrouping:是否对数据分组,默认为true
- hideGroupedColumn:是否隐藏分组列,默认为false
- ignoreAdd:在向表格中添加数据时是否刷新表格,默认为false
- showGroupName:是否在分组行上显示分组字段的名字,默认为true
- startCollapsed:初次显示时分组是否处于收缩状态,默认为false
- 主要方法:
- collapseAllGroups():收缩所有分组行
- expandAllGroups():展开所有分组行
- getGroupId( String value ):根据分组字段值取得组id
- toggleAllGroups( [Boolean expanded] ):切换所有分组行的展开或收缩状态
- toggleGroup( String groupId, [Boolean expanded] ):切换指定分组行的展开或收缩状态
- 2、Ext.data.GroupingStore
- groupField:分组字段
- groupOnSort:是否在分组字段上排序,默认为false
- remoteGroup:是否远程分组数据,默认为false。如果是远程分组数据,则通过groupBy参数发送分组字段名
- 3、范例源码
- var datas = [[1,"张三",24,"男",new Date(1986,06,09)], [2,"李四",30,"女",new Date(1980,09,13)], [3,"王五",28,"男",new Date(1982,01,10)]];
- var person = Ext.data.Record.create([
- {name: "personId", mapping: 0},
- {name: "personName", mapping: 1},
- {name: "personAge", mapping: 2},
- {name: "personGender", mapping: 3},
- {name: "personBirth", mapping: 4}
- ]);
- var grid = new Ext.grid.GridPanel({
- title: "GroupingView实例",
- renderTo: "div1",
- 500,
- height: 300,
- frame: true,
- tbar: [
- {
- text: "展开/收缩",
- iconCls: "search",
- handler: function(){
- var view = grid.getView();
- //var groupId = view.getGroupId("男");
- //view.toggleGroup(groupId);
- view.toggleAllGroups();
- }
- }
- ],
- store: new Ext.data.GroupingStore({
- reader: new Ext.data.ArrayReader({id:0}, person),
- data: datas,
- sortInfo: {field:"personId", direction:"ASC"}, //数据排序
- groupField: "personGender" //分组字段
- }),
- view: new Ext.grid.GroupingView({
- sortAscText: "升序",
- sortDescText: "降序",
- columnsText: "表格字段",
- groupByText: "使用当前字段进行分组",
- showGroupsText: "表格分组",
- groupTextTpl: "{text}(共{[values.rs.length]}条)"
- }),
- columns: [
- {id:"personId", header:"编号", 50, dataIndex:"personId"},
- {id:"personName", header:"姓名", 70, dataIndex:"personName"},
- {id:"personAge", header:"年龄", 45, dataIndex:"personAge"},
- {id:"personGender", header:"性别", 45, dataIndex:"personGender"},
- {id:"personBirth", header:"出生日期", 120, dataIndex:"personBirth", renderer:Ext.util.Format.dateRenderer("Y年m月d日")}
- ]
- });
- Ext.grid.GridPanel:
- store:表格的数据集
- columns:表格列模式的配置数组,可自动创建ColumnModel列模式
- autoExpandColumn:自动充满表格未用空间的列,参数为列id,该id不能为0
- stripeRows:表格是否隔行换色,默认为false
- cm、colModel:表格的列模式,渲染表格时必须设置该配置项
- sm、selModel:表格的选择模式,默认为Ext.grid.RowSelectionModel
- enableHdMenu:是否显示表头的上下文菜单,默认为true
- enableColumnHide:是否允许通过标题中的上下文菜单隐藏列,默认为true
- loadMask:是否在加载数据时显示遮罩效果,默认为false
- view:表格视图,默认为Ext.grid.GridView
- viewConfig:表格视图的配置对象
- autoExpandMax:自动扩充列的最大宽度,默认为1000
- autoExpandMin:自动扩充列的最小宽度,默认为50
- columnLines:是否显示列分割线,默认为false
- disableSelection:是否禁止行选择,默认为false
- enableColumnMove:是否允许拖放列,默认为true
- enableColumnResize:是否允许改变列宽,默认为true
- hideHeaders:是否隐藏表头,默认为false
- maxHeight:最大高度
- minColumnWidth:最小列宽,默认为25
- trackMouseOver:是否高亮显示鼠标所在的行,默认为true
- 主要方法:
- getColumnModel():取得列模式
- getSelectionModel():取得选择模式
- getStore():取得数据集
- getView():取得视图对象
- reconfigure( Ext.data.Store store, Ext.grid.ColumnModel colModel ):使用一个新的数据集和列模式重新配置表格组件
- 2、Ext.grid.Column
- 主要配置项:
- id:列id
- header:表头文字
- dataIndex:设置列与数据集中数据记录的对应关系,值为数据记录中的字段名称。如果没有设置该项则使用列索引与数据记录中字段的索引进行对应
- width:列宽
- align:列数据的对齐方式
- hidden:是否隐藏列,默认为false
- fixed:是否固定列宽,默认为false
- menuDisabled:是否禁用列的上下文菜单,默认为false
- resizable:是否允许改变列宽,默认为true
- sortable:是否允许排序,默认为true
- renderer:设置列的自定义单元格渲染函数
- 传入函数的参数有:
- value:数据的原始值
- metadata:元数据对象,用于设置单元格的样式和属性,该对象包含的属性有:
- css:应用到单元格TD元素上的样式名称
- attr:一个HTML属性定义字符串,例如'style="color:blue"'
- record:当前数据记录对象
- rowIndex:单元格的行索引
- colIndex:单元格的列索引
- store:数据集对象
- xtype:列渲染器类型,默认为gridcolumn,其它可选值有booleancolumn、numbercolumn、datecolumn、templatecolumn等
- editable:是否可编辑,默认为true
- editor:编辑器
- groupName:
- emptyGroupText:
- groupable:
- 3、Ext.grid.ColumnModel
- 主要配置项:
- columns:字段数组
- defaultSortable:是否进行默认排序,默认为false
- defaultWidth:默认宽度
- 主要方法:
- findColumnIndex( String col ):根据给定的dataIndex查找列索引
- getColumnById( String id ):取得指定id对应的列
- getColumnCount( Boolean visibleOnly ):取得列总数
- getColumnHeader( Number col ):取得列的表头
- getColumnId( Number index ):取得列id
- getDataIndex( Number col ):取得列对应的数据字段名
- getIndexById( String id ):取得列索引
- getTotalWidth( Boolean includeHidden )
- isCellEditable( Number colIndex, Number rowIndex )
- isFixed()
- isHidden( Number colIndex )
- setColumnHeader( Number col, String header )
- setColumnWidth( Number col, Number width, Boolean suppressEvent )
- setDataIndex( Number col, String dataIndex )
- setEditable( Number col, Boolean editable )
- setEditor( Number col, Object editor )
- setHidden( Number colIndex, Boolean hidden )
- setRenderer( Number col, Function fn )
- 4、Ext.grid.AbstractSelectionModel
- 主要方法:
- lock():锁定选择区域
- unlock():解锁选择区域
- isLocked():当前选择区域是否被锁定
- 5、Ext.grid.CellSelectionModel
- 主要方法:
- clearSelections( Boolean preventNotify ):清除选择区域
- getSelectedCell():取得当前选择的单元格,返回一数组,其格式:[rowIndex, colIndex]
- hasSelection():当前是否有选择区域
- select( Number rowIndex, Number colIndex, [Boolean preventViewNotify], [Boolean preventFocus], [Ext.data.Record r] ):选择指定单元格
- 6、Ext.grid.RowSelectionModel
- 主要配置项:
- singleSelect:是否单选模式,默认为false,即可以选择多条数据
- 主要方法:
- clearSelections( [Boolean fast] ):清除所有选择区域
- deselectRange( Number startRow, Number endRow ):取消范围内的行选择
- deselectRow( Number row, [Boolean preventViewNotify] ):取消指定行的选择状态
- each( Function fn, [Object scope] ):遍历所有选择行,并调用指定函数。当前被选行将传入该函数中
- getCount():得到选择的总行数
- getSelected():得到第一个被选记录
- getSelections():得到所有被选记录的数组
- hasNext():判断当前被选行之后是否还有记录可以选择
- hasPrevious():判断当前被选行之前是否还有记录可以选择
- hasSelection():是否已选择了数据
- isIdSelected( String id ):判断指定id的记录是否被选择
- isSelected( Number/Record index ):判断指定记录或记录索引的数据是否被选择
- selectAll():选择所有行
- selectFirstRow():选择第一行
- selectLastRow( [Boolean keepExisting] ):选择最后行
- keepExisting:是否保持已有的选择
- selectNext( [Boolean keepExisting] ):选择当前选择行的下一行
- selectPrevious( [Boolean keepExisting] ):选择当前选择行的上一行
- selectRange( Number startRow, Number endRow, [Boolean keepExisting] ):选择范围内的所有行
- selectRecords( Array records, [Boolean keepExisting] ):选择一组指定记录
- selectRow( Number row, [Boolean keepExisting], [Boolean preventViewNotify] ):选择一行
- row:行索引
- selectRows( Array rows, [Boolean keepExisting] ):选择多行
- rows:行索引数组
- 7、Ext.grid.CheckboxSelectionModel
- 主要配置项:
- singleSelect:是否单选模式,默认为false,即可以选择多条数据
- checkOnly:是否只能通过点击checkbox列进行选择,默认为false
- sortable:是否允许checkbox列排序,默认为false
- width:checkbox列的宽度,默认为20
- 8、Ext.grid.RowNumberer
- 主要配置项:
- header:行号列表头显示的内容
- width:列宽,默认为23
- 9、Ext.grid.GridView
- 主要配置项:
- enableRowBody:是否包含行体
- sortAscText:表格标题菜单中升序的文字描述
- sortDescText:表格标题菜单中降序的文字描述
- columnsText:表格标题菜单中列对应的文字描述
- autoFill:是否自动扩展列以充满整个表格,默认为false
- forceFit:是否强制调整表格列宽以适用表格的整体宽度,防止出现水平滚动条,默认为false
- 主要方法:
- focusCell( Number row, Number col ):将焦点移到指定单元格
- focusRow( Number row ):将焦点移动指定行
- getCell( Number row, Number col ):取得指定单元格对应的td元素
- getHeaderCell( Number index ):取得指定表头对应的td元素
- getRow( Number index ):取得指定行对应的tr元素
- getRowClass( Record record, Number index, Object rowParams, Store store ):得到附加到表格行上的样式名
- record:当前行的数据记录对象
- index:当前行的索引
- rowParams:渲染时传入到行模板中的配置对象,通过它可以为行体定制样式,该对象只在enableRowBody为true时才生效,可能的属性如下:
- body:渲染到行体中的HTML代码片段
- bodyStyle:应用到行体tr元素style属性的字符串
- cols:应用到行体td元素colspan属性的值,默认为总列数
- store:表格数据集
- refresh( [Boolean headersToo] ):刷新表格组件
- scrollToTop():滚动表格到顶端
- Ext.TabPanel:
- activeTab:初始激活的tab,索引或者id值,默认为none
- autoTabs:是否自动将带有'x-tab'样式类的div转成tabs添加到TabPanel中,默认为false。
- 当该配置项设为true时,需要设置deferredRender为false,还必须使用applyTo。
- deferredRender:是否延迟渲染,默认为true。
- autoTabSelector:默认为'div.x-tab'。
- resizeTabs:是否可以改变tab的尺寸,默认为false。
- minTabWidth:tab的最小宽度,默认为30。
- tabWidth:每个新增加的tab宽度,默认为120。
- tabTip:tab的提示信息
- tabPosition:tab位置,可选值有top、bottom,默认为top。
- enableTabScroll:是否允许Tab溢出时可以滚动,默认为false。
- closable:tab是否可关闭,默认为false
- scrollDuration:每次的滚动时长,默认为0.35毫秒。
- scrollIncrement:每次的滚动步长,默认为100像素。
- wheelIncrement:每次鼠标滑轮的滚动步长,默认为20像素。
- 2、主要方法:
- activate( String/Panel tab )
- getActiveTab():获取当前活动的tab
- get( String/Number key ):根据组件id或者索引获取组件
- getItem(String id):根据tab id获取tab
- setActiveTab( String/Number item )
- remove( Component/String component, [Boolean autoDestroy] )
- removeAll( [Boolean autoDestroy] )
- 3、范例
- new Ext.TabPanel({
- id: "mainTab",
- renderTo: "div1",
- 500,
- height: 300,
- activeTab: 0,
- defaults: {
- autoScroll: true,
- autoHeight:true,
- style: "padding:5"
- },
- items:[
- {title:"normal", tabTip:"mormal", html:"tab1", iconCls:"add"},
- {title:"ajax1", autoLoad:"messagebox.action", iconCls:"delete"},
- {title:"ajax2", autoLoad:{url:"test.action", params:"p1=v1", nocache:true}, iconCls:"search"},
- {title:"event", iconCls:"save", listeners:{activate:activateHandler}}
- ],
- enableTabScroll: true
- });
- function activateHandler(tab){
- //alert(tab.title);
- }
- var index = 0;
- function addTab(){
- var tabs = Ext.getCmp("mainTab");
- var t = tabs.getItem("tab"+index);
- if(t) tabs.remove(t);
- tabs.add({
- id: "tab" + (++index),
- title: "NewTab" + index,
- html: "new tab" + index,
- closable: true
- }).show();
- }
- //按钮渲染到div1元素之前
- new Ext.Button({
- text:"add tab",
- handler:addTab,
- iconCls:"add"
- }).render(document.body, "div1");
- 在使用TabPanel时需要注意:
- 1、在创建Ext.TabPanel时deferredRender配置项经常会被忽略。该配置项的默认值是true。true表示只有在用户第一次访问 选项卡时,该选项卡的panel才会被渲染。 所以当我们有可能使用脚本操作选项卡时,谨记将该配置项设置为false。
- 2、在FormPanel中使用TabPanel,如果在TabPanel中不定义deferredRender的值为false,那么,当你使用 Load方法为Form加载数据,或使用setValue为没有激活过的Panel的控件赋值时,将会发生错误。原因是,在默认设置下 deferredRender为true,TabPanel并不会渲染所有Panel上的控件,只有在该Panel被激活时才渲染控件,所以当你为这些控 件设置数据时,将会找不到这些控件,会出现错误。因而,在FormPanel中使用TabPanel,一定要在TabPanel中设置 deferredRender的值为false,强制TabPanel在Layout渲染时同时渲染所有Panel上的控件。