View Full Version : Restrict user from entering wrong/invalid data in Textfield.

11 Apr 2012, 2:25 AM
HI Guys,

I have a textfield and want to restrict the user from entering special chars. he should be able to type only numeric values.I have written a vtype for it, but i want the user should not be able to enter the invalid values.
How can i achieve it in Extjs.

11 Apr 2012, 2:44 AM
You have a very good example here: http://docs.sencha.com/ext-js/4-0/#!/guide/forms (http://docs.sencha.com/ext-js/4-0/#%21/guide/forms)

11 Apr 2012, 3:35 AM

Thanks for your reply, the URL u suggested actually refers to the vtype and not to handle my keystrokes.
what my requirement is something like http://www.javascripter.net/faq/keyboardinputfiltering.htm

i don't want the user to enter any invalid data in.


11 Apr 2012, 3:59 AM
Just saw about the masking in Ext.form.field.VTypes, i am still searching for my custom mask.

11 Apr 2012, 4:01 AM
maskRe is the config bit you want on your textfield. This allows you to filter user input to only the desired characters, using a RegEx expression.

This example only allows upper/lower case alphas and numeric input:

Ext.create('Ext.window.Window', {
bodyPadding: 5,
defaults: {
labelWidth: 140,
labelSeparator: ''
title: 'maskRe RegEx Example',
width: 300,
items: [{
xtype: 'textfield',
fieldLabel: 'Numbers/Letters Only!',
maskRe: /[A-Za-z0-9]/,
width: 280

11 Apr 2012, 4:45 AM
Thanks a lot,

worked fine.