How do I change the radiobuttonlist's text property using javascript

Hi experts,

I have a radiobuttonlist with nine radiobuttons that, at runtime depending on what year it is, must change the text property i.e the text displayed next to the actual radiobuttons in the radiobuttonlist. With the code I've got so far I get the correct ID for the buttons and I'm able to get/set the value property, but can't set the text (visual) property. Below I'll inclued the relevant HTML and javascript code.

The HTML code:
<asp:RadioButtonList ID='RdoLstYear' RepeatDirection='Horizontal' runat="server" RepeatColumns="3" RepeatLayout="table">
                            <asp:ListItem>2003</asp:ListItem>
                            <asp:ListItem>2004</asp:ListItem>
                            <asp:ListItem>2005</asp:ListItem>
                            <asp:ListItem>2006</asp:ListItem>
                            <asp:ListItem>2007</asp:ListItem>
                            <asp:ListItem>2008</asp:ListItem>
                            <asp:ListItem>2009</asp:ListItem>
                            <asp:ListItem>2010</asp:ListItem>
                            <asp:ListItem>2011</asp:ListItem>
                        </asp:RadioButtonList>
                    </div>

//The javascript code:
<script language="javascript" type="text/javascript">
    function togglePannelStatus(content)
    {
       
        var ListControl= document.getElementById("<%=RdoLstYear.ClientID%>");
        var options = ListControl.getElementsByTagName('input');
        for(i=0;i<options.length;i++){
              var opt = options[i];
              //opt[i].text = 2004;             //this does not work. I want to be able to set this to eg. yearVar + i
        }
}
</script>
Caroline_SwartAsked:
Who is Participating?
 
TimYatesConnect With a Mentor Commented:
Right....try this:

    function togglePannelStatus(content)
    {
        var ListControl = document.getElementById( "<%=RdoLstYear.ClientID%>" ) ;
        var options = ListControl.getElementsByTagName( 'label' ) ;
        for( i=0 ; i < options.length ; i++ )
        {
              options[ i ].innerText = '2004' ;
        }
}
0
 
TimYatesCommented:
Can you post the generated HTML for that?

I'm not familiar with what the asp:ListItem tag outputs
0
 
Caroline_SwartAuthor Commented:
Is this what you are looking for?

<div style="border: silver 1px solid; float:right;">
                        <table id="CalendarView1_RdoLstYear" border="0">
      <tr>
            <td><input id="CalendarView1_RdoLstYear_0" type="radio" name="CalendarView1$RdoLstYear" value="2003" /><label for="CalendarView1_RdoLstYear_0">2003</label></td><td><input id="CalendarView1_RdoLstYear_1" type="radio" name="CalendarView1$RdoLstYear" value="2004" /><label for="CalendarView1_RdoLstYear_1">2004</label></td><td><input id="CalendarView1_RdoLstYear_2" type="radio" name="CalendarView1$RdoLstYear" value="2005" /><label for="CalendarView1_RdoLstYear_2">2005</label></td>
      </tr><tr>
            <td><input id="CalendarView1_RdoLstYear_3" type="radio" name="CalendarView1$RdoLstYear" value="2006" /><label for="CalendarView1_RdoLstYear_3">2006</label></td><td><input id="CalendarView1_RdoLstYear_4" type="radio" name="CalendarView1$RdoLstYear" value="2007" /><label for="CalendarView1_RdoLstYear_4">2007</label></td><td><input id="CalendarView1_RdoLstYear_5" type="radio" name="CalendarView1$RdoLstYear" value="2008" /><label for="CalendarView1_RdoLstYear_5">2008</label></td>
      </tr><tr>
            <td><input id="CalendarView1_RdoLstYear_6" type="radio" name="CalendarView1$RdoLstYear" value="2009" /><label for="CalendarView1_RdoLstYear_6">2009</label></td><td><input id="CalendarView1_RdoLstYear_7" type="radio" name="CalendarView1$RdoLstYear" value="2010" /><label for="CalendarView1_RdoLstYear_7">2010</label></td><td><input id="CalendarView1_RdoLstYear_8" type="radio" name="CalendarView1$RdoLstYear" value="2011" /><label for="CalendarView1_RdoLstYear_8">2011</label></td>
      </tr>
</table>
                    </div>
                </div>
0
 
TimYatesCommented:
:-)
0
 
Caroline_SwartAuthor Commented:
This is exactly what I needed. Thankyou for a clear and quick response
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

All Courses

From novice to tech pro — start learning today.