Conditional Javascript not allowed??

We have a very basic <script> tag placed in the content placed holder header of a custom aspx page.  The javascript causes a text box to appear when a radio button is selected.  However, the for loop (that parses selected radio button options) as well as the conditional (if/else) statement are NOT firing.  When i developed the page on my local host before integrating it, it worked flawlessly (it's a simple function). However upon incorporating it into wcm......broken! i placed alerts all throughout the function to see where it's not firing and it refuses to execute the conditional or the loop. Is there something in wcm that must be enabled to allow conditionals? Is there something else I'm not aware of in WCM?? Any assitance is appreciated.

function rBtnClick() {
               alert('inside rbtnclick'); // firing
               var radio = document.getElementsByName('RadioButtonList8');
               alert('assigned radio'); // firing

               for (var i = 0; i < radio.length; i++) {
                   alert('inside for'); //not firing
                   if (radio[i].checked) {
                       alert('a button has been checked'); //not firing
                       if (radio[i].value == 'Yes') {
                           alert('displaying explanation box'); //not firing
                           document.getElementById('question8Yes').style.display = 'block';
                       }
                       else {
                           alert('removing explanation box'); //not firing
                           document.getElementById('question8Yes').style.display = 'none';
                       }
                   }

               }
              
           }

Comment viewing options

Select your preferred way to display the comments and click "Save settings" to activate your changes.

could you post your html

could you post your html code for this page

HTML code

<asp:Content id="Head" ContentPlaceHolderID="TemplateHead" runat="server">
    <title>Patient Safety Event Report</title>
   
    <script type="text/javascript" language="javascript">
           alert('recongized javascript');

           function rBtnClick() {
               alert('inside rbtnclick');
               var radio = document.getElementsByName('RadioButtonList8');
               alert('assigned radio');

               for (var i = 0; i < radio.length; i++) {
                   alert('inside for');
                   if (radio[i].checked) {
                       alert('a button has been checked');
                       if (radio[i].value == 'Yes') {
                           alert('displaying explanation box');
                           document.getElementById('question8Yes').style.display = 'block';
                       }
                       else {
                           alert('removing explanation box');
                           document.getElementById('question8Yes').style.display = 'none';
                       }
                   }

               }
              
           }

           function textBoxValidation(oSrc, args) {
               alert('inside textbox validation');
               var radioButtons = document.getElementsByName('RadioButtonList8');
               alert('assigned radiobutton list');
               var textBox = document.getElementById('txtQuestion8');
               alert('assigned text box');
               for (var x = 0; x < radioButtons.length; x++) {
                   alert('inside for loop');
                   if (radioButtons[x].checked) {
                       alert('inside if radiobuttons checked part');
                       if (radioButtons[x].value == 'Yes') {
                           alert('radiobutton yes was checked');
                           if (textBox.value.length < 1) {
                               args.IsValid = false;
                               alert('Yes checked textbox empty');
                           }
                           else {
                               args.IsValid = true;
                               alert('yes checked textbox has something');
                           }
                       }
                       else {
                           args.IsValid = true;
                           //alert('yes was not checked');
                       }
                   }
               }
           }

           alert('finished recognizing javascript');
   
    </script>

<asp:Content id="Main" runat="server" ContentPlaceHolderID="TemplateBody">
    <div id="q8">
        <b>8.  Was any....?</b>
        <asp:RadioButtonList ID="RadioButtonList8" runat="server" >
            <asp:ListItem Text="Yes" Value="Yes"></asp:ListItem>
            <asp:ListItem Text="No" Value="No"></asp:ListItem>
            <asp:ListItem Text="Unknown" Value="Unknown"></asp:ListItem>
        </asp:RadioButtonList>
        <asp:RequiredFieldValidator ID="RequiredFieldValidator8" runat="server" ControlToValidate="RadioButtonList8" Text="*"></asp:RequiredFieldValidator>
        <div id="question8Yes" style="display:none">
            If Yes, please specify:
            <br />
            <asp:TextBox ID="txtQuestion8" runat="server" MaxLength="250" Width="350px"></asp:TextBox>
            <asp:Label ID="Label1" runat="server" Text=""></asp:Label>
            <asp:CustomValidator ID="CustomValidator1" ControlToValidate="txtQuestion8" runat="server" ValidateEmptyText="true"
                ClientValidationFunction="textBoxValidation" ErrorMessage="Please expalin why" Text="*"></asp:CustomValidator>
        </div>
       
        <br />
    </div>

</asp:Content>

Since RadioButtonList8

Since RadioButtonList8 is an ASP.Net server control you can't access directly using server ID because it creates different DOM IDs while rendering the page

 This is wrong

var radioButtons = document.getElementsByName('RadioButtonList8');

You would need to change your code like below

<script type="text/javascript">
       
function rBtnClick() {
            document
.getElementById('question8Yes').style.display = 'none';

           
var radiobuttonList = document.getElementById('<%= RadioButtonList8.ClientID %>');
           
var options = radiobuttonList.getElementsByTagName('input');
           
for (var i = 0; i < options.length; i++) {
               
if (options[i].value == "Yes" && options[i].checked)
                    document
.getElementById('question8Yes').style.display = 'block';
           
}
       
}
   
</script>

Balaji