CODEWITHSUNDEEP
asp.net
Ashutosh
Ashutosh

Reputation: 4675

ASP.NET validating multiple checkbox list in repeater

I'm working on campaigns which can have multiple questions for users. Each question can be of type textbox, radio button list, drop down list and checkbox list.

I have a repeater for showing questions in which each item has a question with single or multiple type answers.

I'm trying to validate if the user have answered a question. I'm assigning validation controls dynamically from code behind (repeater item bound) I am able to validate textbox, radiobutton list and drop down list but not table to validate checkbox list.

As I understand, required field validator cannot be used directly to checkbox list. We have to write a custom validator function in JavaScript.

The example I searched mostly contain single checkbox per repeater item.

Whereas in my case, there may be multiple questions with checkbox list (multiple checkboxes).

What is the best way of validating such checkbox lists?

Here is my repeater content template content:

<div class="row validation-container">
    <div class="col-md-12 col-lg-12">
       <asp:TextBox ID="txtAnswer" CssClass="form-control" runat="server" TextMode="MultiLine" Rows="2" ValidationGroup="Campaign"></asp:TextBox>

       <asp:RadioButtonList ID="rdAnswer" runat="server"></asp:RadioButtonList>

       <asp:DropDownList ID="ddnAnswer" runat="server"></asp:DropDownList>

       <asp:CheckBoxList ID="chkAnswer" CssClass="chkAnswer" runat="server"></asp:CheckBoxList>

       <asp:Label ID="lbAnswerRequired" runat="server" Visible="false" style="color:#f00"/>

       <asp:RequiredFieldValidator ID="reqValidator" runat="server" Display="Dynamic" style="color: #f00" />

       <asp:CustomValidator ID="customValidator" runat="server" />
       <hr />
       </div>
   </div>
</ItemTemplate>

I hope I'm able to clarify my question.

Upvotes: 1

Views: 575

Answers (1)

VDWWD
VDWWD

Reputation: 35564

This can be done with a CustomValidator and some javscript. For this example to work the CustomValidator and the CheckBoxList must be in the same div.

<script>
    function checkRadioOrCheckboxList(id) {
        var isValid = false;
        $('#' + id + ' input').each(function () {
            if ($(this).prop("checked")) {
                isValid = true;
            }
        });
        return isValid;
    }

    function chkAnswer(sender, element) {
        var id = $('#' + sender.id).closest('div').find('.chkAnswer').prop('id');
        element.IsValid = checkRadioOrCheckboxList(id);
    }
</script>

ASPX example

<asp:Repeater ID="Repeater1" runat="server">
    <ItemTemplate>

        <div>
            <asp:CheckBoxList ID="chkAnswer" CssClass="chkAnswer" runat="server">
                <asp:ListItem>Item 1</asp:ListItem>
                <asp:ListItem>Item 2</asp:ListItem>
                <asp:ListItem>Item 3</asp:ListItem>
            </asp:CheckBoxList>
            <asp:CustomValidator ID="CustomValidator1" runat="server" ErrorMessage="Select a CheckBox" ClientValidationFunction="chkAnswer"></asp:CustomValidator>
        </div>
        <hr />

    </ItemTemplate>
</asp:Repeater>

Upvotes: 1

Related Questions