ComboBox Feature Validation|UI Control for ASP.NET AJAX, C#, VB.NET

ComboBox Feature Validation in ASP.NET

Home > How to > ComboBox Validation

ComboBox Feature Validation in ASP.NET

What is asp.net combobox validation feature? The validation function is used when the current Text value of the web combobox is not compatible with the logic that is set by the developers.

Why to add this validation feature to asp.net ComboBox Control? The practical values of the combobox can be demonstrated from many aspects. And here we just list one simple example to illustrate its benefits. Suppose you want to add a web combobox into a user registration web page, to make sure that the user have selected or entered a valid value in the input area of the combobox before submission, you need to integrate a field validator into the combobox.

How to validate the combobox in ASP.NET AJAX? As the ComboBox Control has offered a validation property for developers, it is extremely easy to validate the combobox in aspx web page. And in following text, we will provide you with detailed programming examples for answering this question.

Using ASP.NET Custom Validator

In this section, we will offer you sample programming codes to show you how to validate the combobox text against the custom validation logic that is predefined by developers.

Aspx Code:

<h3>Selection form</h3>
                <ul>
                    <li>
                        <label>Gender:</label>
                        <kettic:PerComboBox ID="PerComboBox2" runat="server" Width="180" skin="Forest"/>
                    </li>
                    <li>
                        <label>Age: </label>
                        <kettic:PerComboBox ID="PerComboBox3" runat="server" Width="180" skin="Forest"/>
                    </li>
                    <li>
                        <label>Country:</label>
                        <kettic:PerComboBox ID="PerComboBox4" runat="server" Width="180" skin="Forest"/>
                    </li>
                </ul>
                <asp:CustomValidator ID="CustomValidator1" 
ErrorMessage="Please choose your gender, age and country !"
ClientValidationFunction="selectionFormValidationGroup"
                     ValidationGroup="SelectionFormValidationGroup" runat="server"  />
                <p >
                    <asp:Button ID="Button3" runat="server" Text="Submit" 
ValidationGroup="SelectionFormValidationGroup" />
                </p>

Javascript Code:

function selectionFormValidationGroup(sender, args) {
                var combos = $kettic.$(".selection-form .PerComboBox");

                args.IsValid = true;

                for (var i = 0; i < combos.length; i++) {
                    if (combos[i].value == "-1") {
                        args.IsValid = false;
                        break;
                    }
                }
            }

C# Code:

protected void Page_Load(object sender, EventArgs e)
        {
            if (!Page.IsPostBack)
            {
                LoadGenders();
                LoaAges();
                LoadCountries();
            }

            LoadDefaultItems();
        }

        private void LoadDefaultItems()
        {
            PerComboBox2.DefaultItem.Text = "-Please select gender";
            PerComboBox2.DefaultItem.Value = "-1";

            PerComboBox3.DefaultItem.Text = "-Please select age";
            PerComboBox3.DefaultItem.Value = "-1";

            PerComboBox4.DefaultItem.Text = "-Please select country";
            PerComboBox4.DefaultItem.Value = "-1";
        }
        private void LoadGenders()
        {
            PerComboBox2.Items.Add(new PerComboBoxItem("Male"));
            PerComboBox2.Items.Add(new PerComboBoxItem("Female"));
        }

        private void LoaAges()
        {
            PerComboBox3.Items.Add(new PerComboBoxItem("0 - 17"));
            PerComboBox3.Items.Add(new PerComboBoxItem("18 - 25"));
            PerComboBox3.Items.Add(new PerComboBoxItem("26 - 30"));
            PerComboBox3.Items.Add(new PerComboBoxItem("31 - 40"));
            PerComboBox3.Items.Add(new PerComboBoxItem("41 - 60"));
        }

        private void LoadCountries()
        {
            PerComboBox4.Items.Add(new PerComboBoxItem("USA"));
            PerComboBox4.Items.Add(new PerComboBoxItem("Australia"));
            PerComboBox4.Items.Add(new PerComboBoxItem("Singapore"));
        }

The simple combobox validating feature has been successfully added to combobox. After you run the application, if you click the submit button before you select a valid value for each field, the validation function will be triggered and display the error image to remind you to enter a valid value. The image attached below shows the result of above combobox validating programming examples.