ExtJS

1. 定义一个Ext.tree.TreePanel,在里面添加一个属性监听事件afterrender,并调用方法expandAll(),代码如下:
    listeners: {   afterrender: function(node) {   this.expandAll();//展开树  }  }
 
2. 在定义下拉框时,要注意选择mode是为'local'(默认为 'remote'),否则没有数据。
 
3. ExtJS验证:
          一、基本验证方式,使用vtype属性。

1.alpha只能输入字母,无法输入其他(如数字,特殊符号等)

2.alphanum只能输入字母和数字,无法输入其他

3.email验证,要求的格式是master@weilog.net

4.url格式验证,要求的格式是http://www.baidu.com

二、其他方式验证。

1. 验证最大最小输入字数。

maxLength : 20,//允许输入的最大字符数
maxLengthText : "用户帐号最大长度不能超过20个字符!",//提示文本
minLength : 3, //允许输入的最少字符数
minLengthText : "用户帐号最小长度不能少于3个字符!",//提示文本

注意:中文字符不是两个字符,比如“你好”算2个字符。

2. 正则表达式验证。

regex : /^(([0-9]+[a-zA-Z]+)|([a-zA-Z]+[0-9]+))$/,
regexText : "对不起,用户帐号只能输入字母和数字!",

三、vtype实现高级验证。

因为Extjs的vtype只实现了四种基本的验证方式,所有需要自己去创建新的验证方式。

在表单初始化时后面加入代码

Ext.apply(Ext.form.VTypes, {
    verifycustomer : function(value) {//验证方法名
        //验证方法
    }
});

设置控件的vtype属性为自定义的验证方法名和提示文本vtypeText属性。

vtype : "verifycustomer",
vtypeText : "对不起,客户账号已经存在!",
xtype                 Class
-------------       ------------------
box                 Ext.BoxComponent 具有边框属性的组件
button            Ext.Button  按钮
colorpalette   Ext.ColorPalette 调色板
component    Ext.Component 组件
container      Ext.Container 容器
cycle             Ext.CycleButton 
dataview        Ext.DataView 数据显示视图
datepicker     Ext.DatePicker 日期选择面板
editor            Ext.Editor 编辑器
editorgrid       Ext.grid.EditorGridPanel 可编辑的表格 
grid               Ext.grid.GridPanel 表格
paging           Ext.PagingToolbar 工具栏中的间隔
panel            Ext.Panel 面板
progress         Ext.ProgressBar 进度条
splitbutton      Ext.SplitButton 可分裂的按钮
tabpanel         Ext.TabPanel 选项面板
treepanel        Ext.tree.TreePanel 树
viewport         Ext.ViewPort 视图
window           Ext.Window 窗口
工具栏组件有
---------------------------------------
toolbar          Ext.Toolbar 工具栏
tbbutton         Ext.Toolbar.Button 按钮
tbfill           Ext.Toolbar.Fill 文件
tbitem           Ext.Toolbar.Item 工具条项目
tbseparator      Ext.Toolbar.Separator 工具栏分隔符
tbspacer         Ext.Toolbar.Spacer 工具栏空白
tbsplit          Ext.Toolbar.SplitButton 工具栏分隔按钮
tbtext           Ext.Toolbar.TextItem 工具栏文本项
表单及字段组件包含:
---------------------------------------
form             Ext.FormPanel Form面板 
checkbox         Ext.form.Checkbox checkbox录入框
combo            Ext.form.ComboBox combo选择项
datefield        Ext.form.DateField 日期选择项
field            Ext.form.Field 表单字段
fieldset         Ext.form.FieldSet 表单字段组
hidden           Ext.form.Hidden 表单隐藏域
htmleditor       Ext.form.HtmlEditor html编辑器
numberfield      Ext.form.NumberField 数字编辑器
radio            Ext.form.Radio 单选按钮
textarea         Ext.form.TextArea 区域文本框
textfield        Ext.form.TextField 表单文本框
timefield        Ext.form.TimeField 时间录入项
trigger          Ext.form.TriggerField 触发录入项
如果要使输入域为密码类型可以使用
inputType: 'password'
如果:
{xtype:'textfield',inputType: 'password',fieldLabel: '密码',name: 'PASSWORD',allowBlank:false,anchor:'95%'}
posted @ 2014-03-03 11:08  簡單D幸福  阅读(262)  评论(0编辑  收藏  举报