May 16, 2013, 11:57 AM
Sorry, that doesn't make a difference.
Ext.ux.netbox.InputTextMask.prototype.changeMask = function (newMask, newClearWhenInvalid) {
var maskPlugin = this;
var field = maskPlugin.field;
//added
field.un('render', maskPlugin.assignEl, maskPlugin);
field.un('blur', maskPlugin.removeValueWhenInvalid, maskPlugin);
field.un('focus', maskPlugin.processMaskFocus, maskPlugin);
field.getEl().purgeAllListeners();
field.initEvents();
if (Ext.isArray(field.plugins)) {
field.plugins.pop(maskPlugin);
}
else {
field.plugins = null;
}
//added
if (newMask == null) {
return;
}
maskPlugin = new Ext.ux.netbox.InputTextMask({ mask: newMask, clearWhenInvalid: newClearWhenInvalid });
this.viewMask = maskPlugin.viewMask;
this.rawMask = maskPlugin.rawMask;
this.maskArray = maskPlugin.maskArray;
if (Ext.isArray(field.plugins)) {
field.plugins.push(maskPlugin);
}
else {
field.plugins = maskPlugin;
}
maskPlugin.init(field);
};
<%@ Page Language="C#" %>
<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
<%@ Register Assembly="Ext.Net.UX" Namespace="Ext.Net.UX" TagPrefix="ux" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
<title></title>
<ext:ResourcePlaceHolder ID="ResourcePlaceHolder1" runat="server" Mode="Script" />
<ext:ResourcePlaceHolder ID="ResourcePlaceHolder2" runat="server" Mode="Style" />
<script type="text/javascript">
var resize = function () {
if (!DisplayFieldZipExtensionDash.isVisible()) {
TextPostalCode.setWidth(160);
TextPostalCode.width = 160;
DisplayFieldZipExtensionDash.show();
TextFieldZipExtension.show();
TextPostalCode.setValue(null);
InputTextMaskPostalCode.changeMask(null, false);
}
else {
TextPostalCode.setWidth(270);
TextPostalCode.width = 270;
DisplayFieldZipExtensionDash.hide();
TextFieldZipExtension.hide();
TextPostalCode.setValue(null);
//InputTextMaskPostalCode.changeMask("L9L 9L9", false);
InputTextMaskPostalCode.changeMask("X[ABCEGHJKLMNPRSTV\\XY]X9X[A-Z]X 9X[A-Z]X9", false);
}
CompositeField1.doLayout();
};
Ext.namespace('Ext.ux.netbox');
Ext.ux.netbox.InputTextMask.InputTextMaskExtend = Ext.extend(Object, {
constructor:
function (config) {
Ext.apply(this, config);
var mask = config.mask;
var clearWhenInvalid = config.clearWhenInvalid;
if (clearWhenInvalid === undefined) {
this.clearWhenInvalid = true;
} else {
this.clearWhenInvalid = clearWhenInvalid;
}
this.rawMask = mask;
this.viewMask = '';
this.maskArray = [];
var mai = 0;
var regexp = '';
for (var i = 0; i < mask.length; i++) {
if (regexp) {
if (regexp == 'X') {
regexp = '';
}
if (mask.charAt(i) == 'X' && mask.charAt(i - 1) != '\\') {
this.maskArray[mai] = regexp;
mai++;
regexp = '';
}
else if (mask.charAt(i) != '\\') {
regexp += mask.charAt(i);
}
}
else if (mask.charAt(i) == '\\') {
continue;
}
else if (mask.charAt(i) == 'X' && mask.charAt(i - 1) == '\\') {
this.viewMask += mask.charAt(i);
this.maskArray[mai] = RegExp.escape(mask.charAt(i));
mai++;
}
else if (mask.charAt(i) == 'X' && mask.charAt(i - 1) != '\\') {
regexp += 'X';
this.viewMask += '_';
} else if (mask.charAt(i) == '9' || mask.charAt(i) == 'L' || mask.charAt(i) == 'l' || mask.charAt(i) == 'A') {
this.viewMask += '_';
this.maskArray[mai] = mask.charAt(i);
mai++;
} else {
this.viewMask += mask.charAt(i);
this.maskArray[mai] = RegExp.escape(mask.charAt(i));
mai++;
}
}
this.specialChars = this.viewMask.replace(/(L|l|9|A|_|X)/g, '');
}
});
Ext.ux.netbox.InputTextMask.InputTextMaskExtend.prototype = Ext.ux.netbox.InputTextMask.prototype;
Ext.ux.netbox.InputTextMask.InputTextMaskExtend.prototype.changeMask = function (newMask, newClearWhenInvalid) {
var maskPlugin = this;
var field = maskPlugin.field;
//added
field.un('render', maskPlugin.assignEl, maskPlugin);
field.un('blur', maskPlugin.removeValueWhenInvalid, maskPlugin);
field.un('focus', maskPlugin.processMaskFocus, maskPlugin);
field.getEl().purgeAllListeners();
field.initEvents();
if (Ext.isArray(field.plugins)) {
field.plugins.pop(maskPlugin);
}
else {
field.plugins = null;
}
//added
if (newMask == null) {
return;
}
maskPlugin = new Ext.ux.netbox.InputTextMask.InputTextMaskExtend({ mask: newMask, clearWhenInvalid: newClearWhenInvalid });
this.viewMask = maskPlugin.viewMask;
this.rawMask = maskPlugin.rawMask;
this.maskArray = maskPlugin.maskArray;
if (Ext.isArray(field.plugins)) {
field.plugins.push(maskPlugin);
}
else {
field.plugins = maskPlugin;
}
maskPlugin.init(field);
};
Ext.reg('Ext.ux.netbox.InputTextMask.InputTextMaskExtend', Ext.ux.netbox.InputTextMask.InputTextMaskExtend);
</script>
</head>
<body>
<ext:ResourceManager ID="ResourceManager1" runat="server" />
<form id="Form1" runat="server">
<ext:Viewport ID="ViewPort1" Layout="BorderLayout" runat="server">
<Items>
<ext:Panel ID="Panel1" runat="server" Region="Center" Border="false"
Layout="FitLayout" AutoScroll="false">
<Items>
<ext:FormPanel ID="FormPanel1" runat="server"
LabelAlign="Left" Padding="10" ButtonAlign="Left" AutoScroll="false"
Title="Details" Border="true" Frame="false" TrackResetOnLoad="true">
<Items>
<ext:CompositeField ID="CompositeField1" runat="server" FieldLabel="Postal Code">
<Items>
<ext:TextField ID="TextPostalCode" runat="server" SelectOnFocus="true"
ValidateOnEvent="true" EnableKeyEvents="true" Width="270">
<Plugins>
<ext:GenericPlugin ID="InputTextMaskPostalCode" runat="server" InstanceName="Ext.ux.netbox.InputTextMask.InputTextMaskExtend" Mask="X[ABCEGHJKLMNPRSTV\XY]X9X[A-Z]X 9X[A-Z]X9" />
</Plugins>
</ext:TextField>
<ext:DisplayField ID="DisplayFieldZipExtensionDash" runat="server" Text="-" Hidden="true" Width="5">
</ext:DisplayField>
<ext:TextField ID="TextFieldZipExtension" runat="server" SelectOnFocus="true"
ValidateOnEvent="false" EnableKeyEvents="true" AllowBlank="true" Width="95" Hidden="true">
<Plugins>
<ux:InputTextMask ID="InputTextMaskZipExtension" runat="server" ClearWhenInvalid="true"
ValidateRequestMode="Disabled" Visible="true" Mask="9999">
</ux:InputTextMask>
</Plugins>
</ext:TextField>
<ext:ToolbarSpacer Width="40">
</ext:ToolbarSpacer>
<ext:DisplayField ID="DisplayField1" runat="server" Text="Phone:" Width="90">
</ext:DisplayField>
<ext:TextField ID="TextPhone" runat="server" SelectOnFocus="true"
ValidateOnEvent="false" EnableKeyEvents="true" AllowBlank="true" Width="120">
</ext:TextField>
<ext:ToolbarSpacer Width="10">
</ext:ToolbarSpacer>
<ext:DisplayField ID="DisplayField2" runat="server" Text="Extension:" Width="60">
</ext:DisplayField>
<ext:TextField ID="TextPhoneExtension" runat="server"
SelectOnFocus="true" ValidateOnEvent="false" EnableKeyEvents="true" AllowBlank="true"
Width="65">
</ext:TextField>
</Items>
</ext:CompositeField>
</Items>
<Buttons>
<ext:Button ID="Button1" runat="server" Text="Resize">
<Listeners>
<Click Handler="resize();" />
</Listeners>
</ext:Button>
</Buttons>
</ext:FormPanel>
</Items>
</ext:Panel>
</Items>
</ext:Viewport>
</form>
</body>
</html>