Ajax Control Toolkit MaskedEdit

Modified on 2010/04/16 00:41 by Stephen Walther — Categorized as: Uncategorized

MaskedEdit is an ASP.NET AJAX extender that attaches to a TextBox control to restrict the kind of text that can be entered. MaskedEdit applies a "mask" to the input that permits only certain types of characters/text to be entered. The supported data formats are: Number, Date, Time, and DateTime. MaskedEdit uses the culture settings specified in the CultureName property. If none is specified the culture setting will be the same as the page: English (United States).

MaskedEdit Server Properties

The properties in italics are optional.

<ajaxToolkit:MaskedEditExtender
    TargetControlID="TextBox2" 
    Mask="9,999,999.99"
    MessageValidatorTip="true" 
    OnFocusCssClass="MaskedEditFocus" 
    OnInvalidCssClass="MaskedEditError"
    MaskType="Number" 
    InputDirection="RightToLeft" 
    AcceptNegative="Left" 
    DisplayMoney="Left"
    ErrorTooltipEnabled="True"/>


/ - Date separator
<ESC>:</ESC> - Time separator
. - Decimal separator
, - Thousand separator
\ - Escape character
{ - Initial delimiter for repetition of masks
} - Final delimiter for repetition of masks

Examples 
9999999 - Seven numeric characters 
99\/99 - Four numeric characters separated in the middle by a "/"








MaskedEdit Validator Description

MaskedEditValidator is a custom validator which attaches to the MaskedEdit extender and its associated TextBox and verifies that the input text matches the pattern specified in the MaskedEdit extender. Once associated with a validation group, server- and client-side validation can be performed and used to display messages. MaskedEditValidator Properties The control above is initialized with this code. The italic properties are optional.

<ajaxToolkit:MaskedEditValidator
    ControlExtender="MaskedEditExtender2"
    ControlToValidate="TextBox2" 
    IsValidEmpty="False" 
    MaximumValue="12000" 
    EmptyValueMessage="Number is required"
    InvalidValueMessage="Number is invalid"
    MaximumValueMessage="Number > 12000"
    MinimumValueMessage="Number < -100"
    MinimumValue="-100" 
    EmptyValueBlurredText="*" 
    InvalidValueBlurredMessage="*" 
    MaximumValueBlurredMessage="*" 
    MinimumValueBlurredText="*"
    Display="Dynamic" 
    TooltipMessage="Input a number: -100 up to 12.000"/>




MaskedEdit Known Issues

Opera's keyboard handling implementation causes the "." key to map to "Del" and the "Ins" key to map to "-".