Hi All

I have been going through the classes we have developed and sharing back with the community some of them that I think will be useful to others. These components have been tested in ext-3.2.1.

Here is: Ext.ux.form.PhoneNumFormater

a plug in that formats text that is typed into a phone number field as you type it

 * @author Will Ferrer, Ethan Brooks
 * @copyright (c) 2012, Intellectual Property Private Equity Group
 * @licensee 2012 developed under license for Switchsoft LLC http://www.switchsoft.com a "Direct response telephony company" as part of it's "VOIP Call distribution, ROI analysis platform, call recording, and IVR for inbound and outbound sales" and Run the Business Systems LLC a "Technology development investment group" as part of it's "PHP, Javascript rapid application development framework and MySQL analysis tools"
 * @license licensed under the terms of
 * the Open Source LGPL 3.0 license.  Commercial use is permitted to the extent
 * that the code/component(s) do NOT become part of another Open
Source or Commercially
 * licensed development library or toolkit without explicit permission.
 * <p>License details: <a href="http://www.gnu.org/licenses/lgpl.html"
 * target="_blank">http://www.gnu.org/licenses/lgpl.html</a></p>
* We are pretty nice just ask. We want to meet our licensees

 * @class Ext.ux.form.PhoneNumFormater
 * @extends Ext.util.Observable
 * a plug in that formats text that is typed into a phone number field as you type it
 * @param {Object} config The config object
 * @ptype ux-form-phonenumformater
Ext.ux.form.PhoneNumFormater = function(config){
    Ext.apply(this, config);
Ext.extend(Ext.ux.form.PhoneNumFormater, Ext.util.Observable, {
    * @cfg {Boolean} countryCode
    * whether or not to force a leading 1 or other country code.
    countryCode : 1,
    // @private
    parent : null,
    // @private
    init: function(parent) {
        this.parent = parent;
        this.parent.enableKeyEvents = true;
        this.parent.on('keyup', this.formatNumber, this.parent);
        this.parent.on('afterrender', this.formatNumber, this.parent);
        this.parent.formatNumber = this.formatNumber;
        this.parent.phoneNumFormater = this;
    // @private
    formatNumber : function () {
        var n,
            inserts = [
                ') ',
        string = this.getValue();
        string = string.replace(/[^\d]/g, '');
        if (string.length>10 || string.charAt(0)==1) {
            curChar = string.charAt(n);
            if (!Ext.isEmpty(inserts[n])) {
                returnString += inserts[n] + curChar;
            } else {
                returnString += curChar;
        if (!Ext.isEmpty(this.phoneNumFormater.countryCode) && returnString.charAt(0)!=this.phoneNumFormater.countryCode && !Ext.isEmpty(returnString)) {
            returnString = this.phoneNumFormater.countryCode + returnString;    

Ext.preg('ux-form-phonenumformater', Ext.ux.form.PhoneNumFormater);
Best regards

Will Ferrer (Run the Business)