Adding a Mask to a Drop-Down List
In This Topic
The C1InputMaskExtender control allows you to create a mask for a drop-down list box. Use the ShowTrigger property to show the drop-down arrow and use the ComboItems property to populate the drop-down list.
- Create an ASP.NET Web application.
- Add a standard TextBox control to the main content of your page.
- Click the TextBox smart tag and select Add Extender from the Tasks menu.
- In the Extender Wizard, select C1InputMaskExtender and click OK. A C1InputMaskExtender control is added to the page and the TargetControlID is set to TextBox1.
- Select View | Properties Window in the Visual Studio menu.
- Click the drop-down list at the top of the Properties window and select TextBox1_C1InputMaskExtender.
- Set the C1InputMaskExtender.Mask property to 000-0000.
- Set the C1InputExtenderBase.ShowTrigger property to True.
- Click the ellipsis button next to the C1InputExtenderBase.ComboItems property. Click the Add button three times and enter three values, for example, 100-1000, 200-2000, and 123-1234.
The markup should now look similar to the following:
<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
<cc1:C1InputMaskExtender ID="TextBox1_C1InputMaskExtender" runat="server" Mask="000-0000" ShowTrigger="True" TargetControlID="TextBox1">
<ComboItems>
<cc1:C1ComboBoxItem Value="100-1000" />
<cc1:C1ComboBoxItem Value="200-2000" />
<cc1:C1ComboBoxItem Value="123-1234" />
</ComboItems>
</cc1:C1InputMaskExtender>
-
Press F5 to run the application. The ShowTrigger property displays the drop-down arrow. The Mask requires digits in the format specified, and the drop-down list specified in the ComboItems property contains three preset values.