articles

Home / DeveloperSection / Articles / The Ajax Toolkit MaskedEditExtender Control in ASP.Net

The Ajax Toolkit MaskedEditExtender Control in ASP.Net

The Ajax Toolkit MaskedEditExtender Control in ASP.Net

Anonymous User28814 07-Dec-2010

The Ajax Toolkit MaskedEditExtender Control in ASP.Net

The MaskedEdit is an ASP.NET AJAX extender that attaches to a TextBox control to restrict the kind of text that can be entered.

The supported data formats are - Number, Date, Time, and DateTime.

MaskedEdit uses the culture settings specified in the CultureName property.

MaskedEdit Properties:

 MaskType - Type of validation to perform:
  • None - No validation
  • Number - Number validation
  • Date - Date validation
  • Time - Time validation
  • DateTime - Date and time validation

 AcceptAMPM - True to display an AM/PM symbol

 AcceptNegative - True if the negative sign (-) is allowed

 AutoComplete - True to automatically fill in empty mask characters not specified by the user

  • MaskType=Number - Empty mask characters will be filled with zeros
  • MaskType=Time - Empty mask characters will be filled with the current time
  • MaskType=Date - Empty mask characters will be filled with the current date
  • MaskType=DateTime - Empty mask characters will be filled with the current date/time

 ErrorTooltipEnabled - True to show a tooltip message when the mouse hovers over an invalid TextBox

 Filtered - Valid characters for mask type "C" (case-sensitive)

 InputDirection - Text input direction

  1. LeftToRight - Left to Right
  2. RightToLeft - Right to left

  MessageValidatorTip - Message displayed when editing in TextBox

MaskedEdit Validator: 

The 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.

MaskedEditValidator Properties: 

ControlToValidate - The ID of the TextBox to validate

ControlExtender - The ID of the MaskedEditExtender attached to the TextBox

AcceptAMPM - Whether or not AM/PM is accepted on time.

ClientValidationFunction - The Client-side script used for custom validation

IsValidEmpty - True if the TextBox can be empty

ValidationExpression - The Regular expression used to validate the input

TooltipMessage - The message displayed when the TextBox has focused with an empty value

EmptyValueMessage - The message displayed when empty and TextBox has to focus

EmptyValueBlurredText - The message displayed when empty and TextBox does not have the focus.

InvalidValueMessage - The message displayed when invalid and TextBox has to focus

InvalidValueBlurredMessage - A message displayed when invalid and TextBox does not have the focus.

MaximumValueMessage - A message displayed when maximum value exceeded and TextBox has the focus.

MaximumValueBlurredMessage - Message displayed when the maximum value exceeded and TextBox does not have the focus.

MinimumValueMessage - The message displayed when minimum value exceeded and TextBox has the focus.

MinimumValueBlurredText - The message displayed when minimum value exceeded and TextBox does not have the focus. 

Code:
 <%-- ScriptManager control manages client script for AJAX enabled ASP.NET pages.This enables partial-page rendering and Web-service calls.You have to used this if you want to use ajax control--%>
<asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>
<%--Use MaskedEditExtender and MaskedEditValidator--%>
 
<cc1:MaskedEditExtender ID="MaskedEditExtender1" runat="server" TargetControlID="TextBox1" MaskType="Date" Mask="99/99/9999">
</cc1:MaskedEditExtender>
 
<cc1:MaskedEditValidator ID="MaskedEditValidator1" runat="server" ControlExtender="MaskedEditExtender1" TooltipMessage="Input a Date"
ControlToValidate="TextBox1" EmptyValueMessage="Date is required" InvalidValueMessage="Date is invalid" IsValidEmpty="False" >
</cc1:MaskedEditValidator>
 
<asp:Label ID="Label1" runat="server" Text="Enter D.O.B"></asp:Label>
<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
<br /><br />
<asp:Button ID="Button1"runat="server" Text="Submit"onclick="Button1_Click"/>
<br />
<asp:Label ID="Label2" runat="server"></asp:Label>

Here Mask="99/99/9999" specify the input format

Run the project

The Ajax Toolkit MaskedEditExtender Control in ASP.Net

When you click the Textbox then a message will show input a date

The Ajax Toolkit MaskedEditExtender Control in ASP.Net

The Ajax Toolkit MaskedEditExtender Control in ASP.Net

When you fill the only the first field and click the Submit button then the remaining field will be taken from the current date.

The Ajax Toolkit MaskedEditExtender Control in ASP.Net

 When you enter an invalid date then an error message will show.   

  The Ajax Toolkit MaskedEditExtender Control in ASP.Net

When you enter a valid date and click Submit button then the date will be shown in the Label                                                                                                     

 The Ajax Toolkit MaskedEditExtender Control in ASP.Net



Updated 10-Jun-2020
I am a content writter !

Leave Comment

Comments

Liked By