Java script not working in any except IE 8 +

[Wired_Nerve]

I have a bit of java script on a master page that is checking a user control nested inside a grid (edit mode) that ensures the user has at-least selected one of the template items in a drop-down list.  
The template in the combo box contains a Check box and label....

If the user tries to submit the edited or new record, a custom validator with a client side event fire and should check to see if they user actually selected at-least 1 of the template check boxes, otherwise it displays an error and the validation control stops the post back to the server...

So if I run this in IE, I have no problems... But it does not seem to validate in chrome, safari and firefox.. I suspect it has to do with the line of code:

items.getItem(i).get_element().innerHTML.indexOf("CHECKED") > 0

Now I can get it  to work if I use a server postback, but I would like to avoid a trip to the server... (see server method c# at the end of the post...)

MASTER PAGE Javascript

<script type="text/javascript">
         function ClientListBoxItemsCountValidate(source, arguments) {
            var listbox = $find(source.controltovalidate);
            var itemsCount = listbox.get_items().get_count();

            if (itemsCount < 1)
                arguments.IsValid = false;
            else if (itemsCount > 0)
                arguments.IsValid = true;
        }

        function ClientComboCountValidate(source, arguments) {
            var comboBox = $find(source.controltovalidate);
            var items = comboBox.get_items();

            for (var i = 0; i < items.get_count(); i++) {
                if (items.getItem(i).get_element().innerHTML.indexOf("CHECKED") > 0) {
                    arguments.IsValid = true;
                } else {
                    arguments.IsValid = false;
                 }
             }
        }
     </script>

ComboBox and Validator in usercontrol nested in a radgrid 

<telerik:RadComboBox ID="RadComboDepartments" runat="server" DataTextField="DepartmentName"
    DataValueField="DepartmentUid" EmptyMessage="Please select" CausesValidation="True">
        <ItemTemplate>
            <asp:CheckBox ID="CheckBox" runat="server" Text='<%# DataBinder.Eval(Container, "DataItem.DepartmentName") %>' />
         </ItemTemplate>
 </telerik:RadComboBox>
     <asp:CustomValidator ID="CustomValidator2" ValidateEmptyText="true" ControlToValidate="RadComboDepartments"
         Display="Dynamic" ClientValidationFunction="ClientComboCountValidate" ErrorMessage="<br />One department must be selected"
         CssClass="Error" runat="server"  />

Not the desired solution:  Server Side Validation...

protected void CustomValidator2_ServerValidate(object source, ServerValidateEventArgs args)

        {

            foreach (RadComboBoxItem item in RadComboDepartments.Items)

            {

                CheckBox chk = (CheckBox)item.FindControl("CheckBox");

                if (chk.Checked)

                {

                    args.IsValid = true;

                    return;

                }

            }

 

            args.IsValid = false;

        }

[Nencho]

Hello Warren,

I can suggest you to access the CheckBox object and determine its check state. In addition, you could add a CssClass to the checkbox, in order to access it with jQuery in the following manner:

//MasterPage

function ClientComboCountValidate(source, arguments) {
           var comboBox = $find(source.controltovalidate);
           var items = comboBox.get_items();

           for (var i = 0; i < items.get_count() ; i++) {
               var checkBox = $telerik.$(items.getItem(i).get_element()).find(".foo")[0];
               if (checkBox.checked) {
                   arguments.IsValid = true;
               } else {
                   arguments.IsValid = false;
               }
           }
       }

//ComboBox declaration

<telerik:RadComboBox ID="RadComboBox1" runat="server" DataTextField="DepartmentName"
      DataValueField="DepartmentUid" EmptyMessage="Please select" CausesValidation="True">
      <ItemTemplate>
          <asp:CheckBox ID="CheckBox" CssClass="foo" runat="server" Text='<%# DataBinder.Eval(Container, "DataItem.DepartmentName") %>' />
      </ItemTemplate>
  </telerik:RadComboBox>

Regards,
Nencho
the Telerik team

[Wired_Nerve]

I will give this a try and report back the results... Thanks for the input...


Warren

[Nencho]

Hello Warren,

Please take your time and let us know if it's works properly at your end.

Kind regards,
Nencho
the Telerik team