Post
Ask Question

Ajax: FilteredTextBoxExtender

In this blog you will learn how validate the textbox by using ajax:FilteredTextBoxExtender. In web application sometimes you have to restrict the user instead wrong entries. There are so many ways to validate the user entries like JavaScript, jQuery, Ajax and etc. Here you will how to validate the user entries by using ajax:FilteredTextBoxExtender.

There are the following properties of FilteredTextBoxExtender:

  • TargetControlID: It targets the the control (textbox) on which your going to perform the validation.

  • FilterType: Is applying type of Filter.

  • FilterMode: It contain ValidChars (default) or InvalidChars.

  • ValidChars: A string consisting of all characters considered valid for the text field, if “Custom” is specified as the filter type. Otherwise this parameter is ignored.

  • InvalidChars: A string consisting of all characters considered invalid for the text field, if “Custom” is specified as the filter type and “InvalidChars” as the filter mode. Otherwise this parameter is ignored.

  • FilterInterval: An integer containing the interval (in milliseconds) in which the field’s contents are filtered, defaults to 250.

  • Numbers: TextBox will accept numbers only.

  • LowercaseLetters: TextBox will accept LowercaseLetter i.e. (a to z alphabets).

  • UppercaseLetters: TextBox will accept UppercaseLetters i.e. (A to Z alphabets).

If set to InvalidChars, FilterType must be set to Custom;

if set to ValidChars, FilterType must contain Custom.

Lets take one example,

  • First Create a new "Empty ASP.NET Web Application".

  • Add reference (ajaxcontroltoolkit.dll) to your project.

  • Add webform to your project Place a script manager on the design page (.aspx), and drag and drop textboxes you required.

  • Then validate those textboxes by using ajax : FilteredTextBoxExtender in your desired format.

To allowing only "numbers":

  1. <asp:TextBox ID="txtNumbers" runat="server"></asp:TextBox>  
  2. <ajax:FilteredTextBoxExtender  
  3.    ID="txtNumbers_FilteredTextBoxExtender"  
  4.    runat="server"  
  5.    Enabled="True"  
  6.    TargetControlID="txtNumbers"  
  7.    FilterType="Custom"  
  8.    FilterMode="ValidChars"  
  9.    ValidChars="0123456789" >  
  10. </ajax:FilteredTextBoxExtender>  
To allowing only "numbers and hiphen sign":
  1. <asp:TextBox ID="txtPhone" runat="server"></asp:TextBox>    
  2. <ajax:FilteredTextBoxExtender    
  3.    ID="txtPhone_FilteredTextBoxExtender"    
  4.    runat="server"    
  5.    Enabled="True"    
  6.    TargetControlID="txtPhone"    
  7.    FilterType="Custom"    
  8.    FilterMode="ValidChars"    
  9.    ValidChars="0123456789-" >    
  10. </ajax:FilteredTextBoxExtender>  
To allowing only "Characters and space":
  1. <asp:TextBox ID="txtCharacters" runat="server"></asp:TextBox>    
  2. <ajax:FilteredTextBoxExtender    
  3.    ID="txtCharacters_FilteredTextBoxExtender"  
  4.    runat="server"    
  5.    Enabled="True"    
  6.    TargetControlID="txtCharacters"    
  7.    FilterType="Custom,LowercaseLetters,UppercaseLetters"    
  8.    FilterMode="ValidChars"    
  9.    ValidChars=" " >    
  10. </ajax:FilteredTextBoxExtender>  
I hope you enjoyed it. please provide your valuable suggestions and feedback.