Required Field Validator for Checkboxlist In Asp.Net Using Jquery

From Asp.net 2.0 & earlier adding required field validator in Checkboxlist was a critical task. But after that whenever custom validation control available in Asp.net toolbox then It’s an easy job. Here I will discuss how to add custom required field validator for checkboxlist in Asp.Net using JQuery. Someone may think that adding “RequiredFieldValidator” & setting “ControlToValidate” property to the Asp.Net checkboxlist control ID will resolve your problem. But unfortunately that’s not the case.

To achieve this you have to use CustomValidator control. This sort of validation control evaluates the value of your desired input control to determine whether it’s valid or not. You can use JQuery or Javascript to check the input validity along with or without server side code. But it’s highly recommend to add server side validation with client side validation to avoid malicious attack. In my previous example i have shared the same custom validation using Javascript but now I am going to share required field validator for checkboxlist in Asp.Net using JQuery.

Important Properties of CustomValidator Control:

  • Clientvalidationfunction: Mention your client side validation code function name. Which is mandatory & It could be a JQuery or Javascript function.
  • ErrorMessage: The message that you want to display in case of validation failed
  • Font & ForeColor: As per your theme color (warning)

Prepare your Page:

To make the example easily understandable consider below script for UI purpose.

 

<h4>Choose your favorite Programming Language:</h4>

    <asp:CheckBoxList ID="CheckBoxList1" runat="server"></asp:CheckBoxList>
    <asp:CustomValidator ID="CustomValidator1" runat="server" ErrorMessage="Please Select at Least One Value !!" ForeColor="Red" Font-Bold="true" clientvalidationfunction="ValidateCheckBoxList" ></asp:CustomValidator>
    <hr />
    <br />
    <asp:Button ID="Button1" runat="server" Text="Save" />

 

 

Final Output of Required Field Validator for Checkboxlist:

required field validator for checkboxlist

Custom JQuery Code for Validation:

Make sure that you have added JQuery CDN/reference in your project.

<script type="text/javascript">
    function ValidateCheckBoxList(sender, args) {
        if($("[id*=CheckBoxList1] input:checked").length > 0)
            args.IsValid = true;
        else
            args.IsValid = false;
    }
</script>

Note: After implementing your validation logic set args.IsValid=true in case of successfull validation. False otherwise.

Bind Test Data With CheckboxList Control:

Replace the below server side code as per business need. To ease the example I am using DataTable instead of Database data.

protected void Page_Load(object sender, EventArgs e)
{
    if(!IsPostBack)
    {
        DataTable dt = new DataTable();

        dt.Columns.Add("ID", System.Type.GetType("System.Int64"));
        dt.Columns.Add("pLanguage");

        DataRow oItem = dt.NewRow();
        oItem[0] = "0";
        oItem[1] = "Asp.Net";
        dt.Rows.Add(oItem);

        oItem = dt.NewRow();
        oItem[0] = "1";
        oItem[1] = "CSharp";
        dt.Rows.Add(oItem);

        oItem = dt.NewRow();
        oItem[0] = "2";
        oItem[1] = "Javascript"; // Though not a language -- Example Purpose
        dt.Rows.Add(oItem);

        oItem = dt.NewRow();
        oItem[0] = "3";
        oItem[1] = "JQuery";
        dt.Rows.Add(oItem);

        oItem = dt.NewRow();
        oItem[0] = "4";
        oItem[1] = "CSS";
        dt.Rows.Add(oItem);

        CheckBoxList1.DataSource = dt;
        CheckBoxList1.DataTextField = "pLanguage";
        CheckBoxList1.DataValueField = "ID";
        CheckBoxList1.DataBind();
    }

}

Hope the above code snippets will help you to implement required field validator for checkboxlist in Asp.net using JQuery. You can also download complete code example from below:

Download C# & VB.NET Source Code:

Download C# Code Example        Download Code Example VB.Net

Still does not resolve “Required Field Validator for Checkboxlist”? Please do comment.

Leave a Reply

Your email address will not be published. Required fields are marked *

AlphaOmega Captcha Classica  –  Enter Security Code