Hierarchy
Ext.BaseExt.form.field.FieldMixed into
Files
这个mixin为逻辑行为及表单项状态提供通用的接口,包括:
NOTE: 当实现自定义表单项时,大多数情况下会继承Ext.form.field.Base组件类而不是直接使用这个mixin 因为BaseField包含额外的逻辑用于生成实际的DOM,其中包括label and error message的显示和 一个表单项输入,此外还有绑定表单项获取和设置表单项值的方法。
如果想直接实现这个mixin并不想继承Ext.form.field.Base,那么大多数情况下重写以下自定义实现方法:getValue, setValue, and getErrors。其他也许也需要重写但是大多数情况他们的基类实现应当已经足够了。 还有需要在组件初始化的过程中确认initField被调用了。
表单项名称。当使用form submit()方法其中包含这个表单项时,name作为参数名称。
为了在表单提交时不包括这个字段,设置submitValue为false
即使表单项启用了,设置为false将防止当前表单项被submitted
Defaults to: true
无论合适检测到表单项的值变化了,指定这个表单项是否立马验证。 如果验证导致表单项有效性的变化,一个validitychange事件将会被触发。 这允许当用户在输入时,这个表单项立马对内容的的有效性给出即时的反馈。
当设置成false,反馈不会立马得到。如果clientValidation配置项Ext.form.Basic.doAction启用了,或者这个表单项或表单手动验证了 则这个表单提交前无论怎样都会被验证。
也可参见 Ext.form.field.Base.checkChangeEvents 来控制表单项的值是检测变化的
Defaults to: true
扩展事件
Defaults to: []
标记这个组件是一个Field。通常是true。
Defaults to: true
配置在value上的表单项的原始值,如果表单的trackResetOnLoad
设置为true
,载入表单上次加载操作的值。
配置在value上的表单项的原始值,如果表单的trackResetOnLoad
设置为true
,载入表单上次加载操作的值。
本身
获取当前类的引用,此对象被实例化。不同于 statics,
this.self
是依赖范围,它意味着要使用动态继承。
参见 statics 详细对比
Ext.define('My.Cat', {
statics: {
speciesName: 'Cat' // My.Cat.speciesName = 'Cat'
},
constructor: function() {
alert(this.self.speciesName); // 依赖 'this'
},
clone: function() {
return new this.self();
}
});
Ext.define('My.SnowLeopard', {
extend: 'My.Cat',
statics: {
speciesName: 'Snow Leopard' // My.SnowLeopard.speciesName = 'Snow Leopard'
}
});
var cat = new My.Cat(); // alerts 'Cat' 猫
var snowLeopard = new My.SnowLeopard(); // alerts 'Snow Leopard' 雪豹
var clone = snowLeopard.clone();
alert(Ext.getClassName(clone)); // alerts 'My.SnowLeopard'
Defaults to: 0
成员
调用原来的方法,这是以前的override重写
Ext.define('My.Cat', {
constructor: function() {
alert("I'm a cat!");
}
});
My.Cat.override({
constructor: function() {
alert("I'm going to be a cat!");
this.callOverridden();
alert("Meeeeoooowwww");
}
});
var kitty = new My.Cat(); // alerts "I'm going to be a cat!"
// alerts "I'm a cat!"
// alerts "Meeeeoooowwww"
This method has been deprecated since 4.1
版本 使用 callParent 代替.
参数的参数,数组或'参数'对象
来自当前方法,例如: this.callOverridden(arguments)
返回调用重写方法的结果。
所谓的"parent"方法是指当前的方法。 这是以前的方法派生或重写(参见 Ext.define)。
Ext.define('My.Base', {
constructor: function (x) {
this.x = x;
},
statics: {
method: function (x) {
return x;
}
}
});
Ext.define('My.Derived', {
extend: 'My.Base',
constructor: function () {
this.callParent([21]);
}
});
var obj = new My.Derived();
alert(obj.x); // alerts 21
这可以用来重写如下:
Ext.define('My.DerivedOverride', {
override: 'My.Derived',
constructor: function (x) {
this.callParent([x*2]); // 调用原来的My.Derived构造
}
});
var obj = new My.Derived();
alert(obj.x); // 现在提示 42
This also works with static methods.
Ext.define('My.Derived2', {
extend: 'My.Base',
statics: {
method: function (x) {
return this.callParent([x*2]); // 调用 My.Base.method
}
}
});
alert(My.Base.method(10); // alerts 10
alert(My.Derived2.method(10); // alerts 20
然后,它也可以重写静态方法。
Ext.define('My.Derived2Override', {
override: 'My.Derived2',
statics: {
method: function (x) {
return this.callParent([x*2]); // 调用 My.Derived2.method
}
}
});
alert(My.Derived2.method(10); // 现在提示 40
这个参数, 通过当前方法得到数组或者 arguments
对象,
例如: this.callParent(arguments)
返回调用父类的方法的结果。
检查表单项自从上次检查后,其值是否变化了 如果值已经改变,将做一下一些操作:
检查表单项的isDirty状态并且如果自从上次检查后改变了触发dirtychange事件
清除对于表单项的无效样式/信息。使用这个mixin的组件应当实现这个方法以清除已存在的错误信息。 Clear any invalid styles/messages for this field. Components using this mixin should implement this method to update the components rendering to clear any existing messages.
Note:这个方法不会引起表单项的validate or isValid方法返回true
如果值确实通过校验。简单的清除表单项的错误也不会允许表单通过Ext.form.action.Submit.clientValidation提交
仅当实例的isFileUpload方法返回true才有用。返回file input DOM元素的引用。这个input将会附加到表单的提交表单上 并且不返回任何值,因此这个方法是创建一个file input 的别名。 Only relevant if the instance's isFileUpload method returns true. Returns a reference to the file input DOM element holding the user's selected file. The input will be appended into the submission form and will not be returned, so this method should also create a replacement.
运行表单项的校验器并返回校验失败的错误信息。 校验时在内部调用,一般不会手动调用
每一个子类应当重写或者扩大返回的值以实现自己的错误信息。 Runs this field's validators and returns an array of error messages for any validation failures. This is called internally during validation and would not usually need to be used manually.
Each subclass should override or augment the return value to provide their own errors.
校验错误使用的值(默认为当前表单项的值)
对于表单项校验产生的所有错误信息;如果无错误信息返回空数组
当Ext.form.Basic.updateRecord调用时,返回表单项保存到Ext.data.Model实例的值.一般来说这个对象为一 个简单的名值对,名字为表单项的name,值为当前数据值。更多高级的表单项实现返回多个名值对。 返回的值将会保存到Model中相应的表单项名称里。
注意这个方法返回的值不能确保成功校验了validated. Note that the values returned from this method are not guaranteed to have been successfully validated.
提交参数名字与值的映射。每一个值都应为一个字符串或者如果这个参数名含有多个值应当是一个字符串数组。 如果提交没有参数也可以返回null
返回表单项的name属性。当在form submit()中包含 表单项的值时用作参数名称。
这个类的初始化配置。典型例子:
Ext.define('My.awesome.Class', {
// 这是默认配置
config: {
name: 'Awesome',
isAwesome: true
},
constructor: function(config) {
this.initConfig(config);
}
});
var awesome = new My.awesome.Class({
name: 'Super Awesome'
});
alert(awesome.getName()); // 'Super Awesome' 超级棒
配置
mixins 混入原型 键-值对
初始化这个Field mixin的当前实例。使用这个mixin的组件在他们自己初始化的过程中将会调用这个方法
基于初始化配置初始化这个表单项的值
如果表单项的值不同于originalValue返回true。 如果表单项禁用了则返回false。
注意 如果其表单form 配置了trackResetOnLoad 则当值通过Ext.form.Basic.setValues载入的时候,
True 如果表单项的值不同于originalValue(并且没有被禁用) false otherwise.
返回这个表单项是否为file upload表单项。如果返回true,表单对于通过AJAX提交表单时 会使用特殊的技术。详情参见Ext.form.Basic.hasUpload。如果返回true,extractFileInput实现会用于 提取相应的file 输入元素。 Returns whether this Field is a file upload field; if it returns true, forms will use special techniques for submitting the form via AJAX. See Ext.form.Basic.hasUpload for details. If this returns true, the extractFileInput method must also be implemented to return the corresponding file input element.
通过validating表单项的当前值,返回当前表单项是否有效 validitychange不会触发。如果你想触发事件,则使用validate方法。 Note:disabled表单项总是视为有效的。
子类实现建议这个方法不要有其他的副作用,如触发信息错误显示
True 如果值有效, 否则 false
关联一个或多个错误信息到这个表单项上。使用这个mixin的组件应当实现这个方法用于更新组件的渲染以显示信息。
Note: 如果值确实通过校验了,这个方法不会引起表单项的validate或者isValid方法的调用以返回false
。
简单的标记表单项为无效不会阻止通过Ext.form.action.Submit.clientValidation的提交
重置表单项的当前值为最初加载的值并清除验证信息。 查看{@linkExt.form.Basic}.trackResetOnLoad
重置表单项的originalValue属性以匹配当前的value。如果表单的 trackResetOnLoad 设置为true,将由 Ext.form.Basic.setValues调用
获取从该对象被实例化的类的引用。 请注意不同于 self,
this.statics()
是独立的作用域,无论this
是否运行,总是返回其中的调用类。
Ext.define('My.Cat', {
statics: {
totalCreated: 0,
speciesName: 'Cat' // My.Cat.speciesName = 'Cat'
},
constructor: function() {
var statics = this.statics();
alert(statics.speciesName); // 总是等于'Cat',无论'this'是什么,
// 相当于:My.Cat.speciesName
alert(this.self.speciesName); // 依赖 'this'
statics.totalCreated++;
},
clone: function() {
var cloned = new this.self; // 依赖 'this'
cloned.groupName = this.statics().speciesName; // 相当于: My.Cat.speciesName
return cloned;
}
});
Ext.define('My.SnowLeopard', {
extend: 'My.Cat',
statics: {
speciesName: 'Snow Leopard' // My.SnowLeopard.speciesName = 'Snow Leopard'
},
constructor: function() {
this.callParent();
}
});
var cat = new My.Cat(); // alerts 'Cat', 然后提示 'Cat'
var snowLeopard = new My.SnowLeopard(); // alerts 'Cat', 然后提示 'Snow Leopard'
var clone = snowLeopard.clone();
alert(Ext.getClassName(clone)); // alerts 'My.SnowLeopard'
alert(clone.groupName); // alerts 'Cat'
alert(My.Cat.totalCreated); // alerts 3
配置扩展
通过validating表单项的当前值,返回当前表单项是否有效 自从上次验证后如果这个有效性有变化触发validitychange事件 Note:disabled表单项总是视为有效的。
子类实现允许这个方法有其他的副作用,如触发信息错误显示 想要验证实现没有副作用,使用isValid.
rue 如果值有效, 否则 false
方法/属性添加到这个类的原型。
Ext.define('My.awesome.Cat', {
constructor: function() {
...
}
});
My.awesome.Cat.implement({
meow: function() {
alert('Meowww...');
}
});
var kitty = new My.awesome.Cat;
kitty.meow();
成员
添加/重写这个类的静态属性。
Ext.define('My.cool.Class', {
...
});
My.cool.Class.addStatics({
someProperty: 'someValue', // My.cool.Class.someProperty = 'someValue'
method1: function() { ... }, // My.cool.Class.method1 = function() { ... };
method2: function() { ... } // My.cool.Class.method2 = function() { ... };
});
成员
this
这个类的原型借用另一个类的成员
Ext.define('Bank', {
money: '$$$',
printMoney: function() {
alert('$$$$$$$');
}
});
Ext.define('Thief', {
...
});
Thief.borrow(Bank, ['money', 'printMoney']);
var steve = new Thief();
alert(steve.money); // alerts '$$$'
steve.printMoney(); // alerts '$$$$$$$'
this 借用成员
创建这个类的新实例。
Ext.define('My.cool.Class', {
...
});
My.cool.Class.create({
someConfig: true
});
所有参数传递至类的构造。
创建的实例。
创建现有的原型方法的别名。例如:
Ext.define('My.cool.Class', {
method1: function() { ... },
method2: function() { ... }
});
var test = new My.cool.Class();
My.cool.Class.createAlias({
method3: 'method1',
method4: 'method2'
});
test.method3(); // test.method1()
My.cool.Class.createAlias('method5', 'method3');
test.method5(); // test.method3() -> test.method1()
别名新方法的名称,或对象设置多个别名。 参见flexSetter
原来的方法名
以字符串格式,获取当前类的名称。
Ext.define('My.cool.Class', {
constructor: function() {
alert(this.self.getName()); // alerts 'My.cool.Class'
}
});
My.cool.Class.getName(); // 'My.cool.Class'
className 类名
重写这个类的成员。通过callParent重写的方法可以调用。
Ext.define('My.Cat', {
constructor: function() {
alert("I'm a cat!");
}
});
My.Cat.override({
constructor: function() {
alert("I'm going to be a cat!");
this.callParent(arguments);
alert("Meeeeoooowwww");
}
});
var kitty = new My.Cat(); // alerts "I'm going to be a cat!我要成为一只猫!"
// alerts "I'm a cat!我是一只猫!"
// alerts "Meeeeoooowwww"
在4.1版本, 直接利用这种方法已经过时了。 使用 Ext.define 代替:
Ext.define('My.CatOverride', {
override: 'My.Cat',
constructor: function() {
alert("I'm going to be a cat!");
this.callParent(arguments);
alert("Meeeeoooowwww");
}
});
以上完成了相同的结果,但可以由Ext.Loader重写, 其目标类和生成过程中,可以决定是否需要根据目标类所需的状态覆盖管理(My.Cat)。
This method has been deprecated since 4.1.0
使用 Ext.define 代替
添加到这个类的属性。 这应当被指定为一个对象包含一个或多个属性的文字。
this class 当前类
Fires when the value of a field is changed via the setValue method.
The new value
The original value
The options object passed to Ext.util.Observable.addListener.
Fires when a change in the field's isDirty state is detected.
Whether or not the field is now dirty
The options object passed to Ext.util.Observable.addListener.
Fires when a change in the field's validity is detected.
Whether or not the field is now valid
The options object passed to Ext.util.Observable.addListener.