RadioButtonList remove all contents and refill using java script

Thanks for the help

what is JavaScript T/A added?

Do you want to do this on the server (as part of your ASP.Net code) or on the client in JavaScript?

Thanks Mr Julian

I am a very old customer of this forum.  In the past there was not exact classifications to some of my questions (or maybe I could not find them).
As a result - topics to me is to invite people that my question is related to subjects within a specific range of fields not within an exact field.

Java
Javascript
asp
html
The last four classifications are in one field, so experts of Java is expected to be experts in html and javascript and asp, That is why I am not specific in selecting the exact class.

I will try next time to be more exact is picking topics.

Returning to my question- The needed code is to be done on the client browser in order to avoid post back delay.

Returning to my question- The needed code is to be done on the client browser in order to avoid post back delay.

I am trying to understand why you want to do t his. If you don't want the radiolist then why render it in the first place.

Assuming there is a valid reason for this -can you show us the rendered code (HTML not the ASP code) and highlight what it is you want to do with that code.

If this is clientside and we need to work with JavaScript we need to work with the Browser version of the site - not the ASP code behind it.

Assume Listbox that contains 1000 items
Assume there are 28 button each with a letters,

If visitor clicks on one button, then list of names that start with picked letter appears in RadioButtonList

if visitor wants to know more about one of RadioButtonList item then he clicks on one RadioButtonList item

So RadioButtonList must be continuously changing as the visitor changes the letter

On the site there are many classifications letters, colors, subjects, ....

Can you show me want a rendered RadioButtonList looks like - I need to see the html to link the JavaScript to.

rendered meaning?

the following is the syntax

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

I am trying to clear it using javascript

                document.getElementById("<%= RLst_CharGroup.ClientID %>").selectedIndex = -1;
                document.getElementById("<%= RLst_CharGroup.ClientID %>").options.length = 0;

which is not acceptable and it gives error

No that is ASP code - I need to see the rendered HTML code -  what is sent to the browser,

The JavaScript operates on the output from the ASP script - so that is what we need to work with.

On google chrome - right click the web page then inspect

Is this rendered HTML code?

Yes - or do a right click and View Source.

If possible strip down the code to just the radio list (for now) if you have a large page posting the whole thing could make it difficult to find what we are looking for.

Right click the lists - go to console and right click - copy - copy outer html

For each item you want to modify.

Post that here

Alternatively - if you have a link OR can setup a Fiddle or similar that would be better.

Before I post this question I have made too many experiments and changed
I will waste time trying to get a reasonable render

It is better to forget about render

To clear listbox using javascript

                document.getElementById("<%= Listbox.ClientID %>").selectedIndex = -1;
                document.getElementById("<%= Listbox.ClientID %>").options.length = 0;
 
Works fine

but to clear RadioButtonList

                document.getElementById("<%= RadioButtonList.ClientID %>").selectedIndex = -1;
                document.getElementById("<%= RadioButtonList.ClientID %>").options.length = 0;

Did not work, is there a way

Without html it is very difficult to see what is going on.

I need to see how a RadioButtonList is rendered. You are trying to access the options property on the element - but I am guessing that the ListBox is implemented as a <select> (which has an options property) and a RadioButtonList is not.

Please provide a working link or some HTML so we can see what is going on.

The following is part of the render of adding items to radiobuttonlist

            <table width="100%" align="right" id="LawGroupTable" style="margin-top: -10px; display: none;" bgcolor="#666666">
                  <tbody>
                        <tr>
                              <td>
                                    <table id="RLst_CharGroup">
                                          <tbody>
                                          <tr>
                                                <td>
                                                <input name="RLst_CharGroup" id="RLst_CharGroup_0" type="radio" value="a">
                                                <label for="RLst_CharGroup_0">1</label>
                                                </td>
                                          </tr>
                                          <tr>
                                                <td>
                                                <input name="RLst_CharGroup" id="RLst_CharGroup_1" type="radio" value="b">
                                                <label for="RLst_CharGroup_1">2</label>
                                                </td>
                                          </tr>
                                          <tr>
                                                <td>
                                                <input name="RLst_CharGroup" id="RLst_CharGroup_2" type="radio" value="c">
                                                <label for="RLst_CharGroup_2">3</label>
                                                </td>
                                          </tr>
                                          </tbody>
                                    </table>
                              </td>
                        </tr>
                  </tbody>
            </table>

Thank you Mr. Julian for trying to help, I also learned from you the meaning of Render