- Create a new js based resource (or use existing one).
Define vtype
Ext.apply(Ext.form.field.VTypes, { myFancyValidator: function(val, field) { //... returns true if valid, false if not } }
On the Project Inspector, browse to the field/editor that you want to validate
- Apply vtype:'myFancyValidator'
Creating custom vTypes in Sencha Architect 3.0
-
17-06-2023 - |
문제
How can I create custom vtypes for form fields validation in Sencha Architect 3.0. I have only found a way to include the already built in types but I want to create a custom one and include it.
해결책
다른 팁
Inside of architect click on the + in the project inspector to bring up the Add menu.
Select Resources-> JS Resources.
Set the URL to a location (resources/myVtypes.js) * this is a file system location so don't include the trail slash unless you want the root directory.
Right click on the resource and select Edit Code -- this will bring up a blank file that you can paste the class into -- and edit it within architect.
Save the project normally to update resource.
Here sample example for create custom vtype for validate pincode numbers:
Ext.define('Ext.form.field.VTypes', {
pin: /(?!(.)\1\1).{3}/,
init: function () {
var me = this;
//pin number
this.pinFn();
//etc..
},
pinFn:function () {
var me = this;
Ext.apply(Ext.form.field.VTypes, {
pin:function (val, field) {
//check value
return me.pin.test(val);
},
pinText: 'Wrong PIN number (numbers cannot be identical)'
});
}
});
After creation you can include in your form
{
fieldLabel: 'PIN Number',
name: 'pin',
minLength: 4,
maxLength: 4,
vtype: 'pin' //coustom vtype
},