Validation for a checklist not working right?

[Calin]

I am using RadWizard steps to make a survey. One step in the Radwizard is to select at least one service they use out of the list of options. When next button is hit, I need to validate that at least one item was checked. If I click next without checking anything, it just goes right to the next step. If I check then uncheck a box, only then does my "Please choose at least one of the options displayed" show up, and it still lets me hit next. What am I doing wrong? I also tried adding the auto postback =false to the Radwizard step, and the Radcheckboxlist itself, and neither helps.  Not sure what I am doing wrong. My code looks like this:

 

<telerik:RadWizardStep ID="RadWizardStep2" runat="server" Title="Services">
                <div>


                    <h3>Please mark all that apply:</h3>
                    <br />
                    <br />
                    <telerik:RadCheckBoxList ID="RadCheckBoxList1" runat="server">
                        <Items>
                            <telerik:ButtonListItem Text="Residential Services" Value="2" />
                            <telerik:ButtonListItem Text="Vocational Services" Value="3" />
                            <telerik:ButtonListItem Text="Transportation/NMT Services" Value="4" />
                            <telerik:ButtonListItem Text="Recreational Services" Value="5" />
                            <telerik:ButtonListItem Text="Supportive living services" Value="6" />
                            <telerik:ButtonListItem Text="Supported employment services" Value="7" />
                            <telerik:ButtonListItem Text="Other" Value="1" />
                        </Items>
                    </telerik:RadCheckBoxList>


                    <asp:RequiredFieldValidator ID="RequiredFieldValidator1" runat="server"
                        ControlToValidate="RadCheckBoxList1"
                        ErrorMessage="Please choose at least one of the options displayed" />



                </div>
                <div>
                    <telerik:RadTextBox ID="OtherTextBox" runat="server" Visible="false"></telerik:RadTextBox>


                </div>

            </telerik:RadWizardStep>

 

[Peter Milchev]

Hello Calin,

Here is one approach you can take to validate a RadCheckBoxList inside a RadWizard:

1.  Enable Unobtrusive Validation for your application. We have a dedicated tutorial which goes into more detail on how to do this. In .NET versions 4.5 and later, you can just set the following key in the web.config: http://stackoverflow.com/questions/16660900/webforms-unobtrusivevalidationmode-requires-a-scriptresourcemapping-for-jquery

<add key="ValidationSettings:UnobtrusiveValidationMode" value="None" />

2.  Use a CustomValidator instead of a RequiredFieldValidator.  Using the clientValidationFunction will allow you to determine if a checkbox has been selected using client-side code.  

<telerik:RadCodeBlock ID="RadCodeBlock1" runat="server">
    <script type="text/javascript">
        function RadCheckBoxValidation(sender, e) {
            var checkboxlist = $find(sender.controltovalidate);
            var selectedList = checkboxlist.get_selectedItems();
            if (selectedList.length > 0) {
                e.IsValid = true;
            } else {
                e.IsValid = false;
            }
        }
    </script>
</telerik:RadCodeBlock>

3.  Set the same ValidationGroup for the RadWizardStep, RadCheckBoxList, and CustomValidator. 

4.   Add the RadCheckBoxList as the CustomValidator's ControlToValidate.

<asp:CustomValidator ID="customValidator1" runat="server" ValidationGroup="validationGroup1"
    ControlToValidate="Questionnaire" ForeColor="Red" CssClass="questionnaire-validation-message"
    ErrorMessage="Please choose at least one of the options displayed" EnableClientScript="true"
    ClientValidationFunction="RadCheckBoxValidation" />

5.  The RadWizardStep needs to have its CauseValidation property set to true.

<telerik:RadWizardStep StepType="Step" CausesValidation="true" ValidationGroup="validationGroup1">
   ...
</telerik:RadWizardStep>

Please take a look at the attached project which demonstrates the above.  For more details on validation with the RadWizard, please take a look at this documentation.

Regards,
Peter Milchev
Progress Telerik