Wouldn’t it be nice to use a combo box of flag images to select the country code of phone numbers?
If you use a country selection component that’s quite easy. Just wrap it in a re-usable component together with a textfield for the local number and the result looks like this:
And here’s the example’s source:
Ext.onReady(function(){
var panel = new Ext.FormPanel({
style: 'padding: 10px;',
frame: true,
labelWidth: 50,
width: 400,
items: [{
fieldLabel: 'Mobile',
xtype: 'phonefield',
anchor: '100%',
emptyText: '(e.g.: 423-423-423)',
defaultCountryCode: '49',
maskRe: /[0-9 -]/
}]
});
var element = Ext.query('script[src$=phonefield.js]')[0];
var renderElement = element.parentNode;
panel.render(renderElement);
});
Update: You can find this code and all my other ExtJS components bundled in a library called ’extensive’. Enjoy the code and feel free to support the project by participating.