Radio Button List with Images

.NET
1

Morning,

I’m trying to attach images to the text of my Radio buttons. There seems to be a way to do this but unfortunately when one does this the HTLM generated is tables. For accessibility purposes this does not meet my needs. Is there any other way to do this?

Thanks

Henry

2

Afternoon!
It sounds like WYSIWYG software is generating the code.
Do you mean you want to use an image instead of text next to the radio button?
In which case, do this:

<input name="name" type="radio" value="value" /><img src="yourimage.jpg" alt="whatthebuttonmeans" />
3

This is my source

    &lt;asp:RadioButtonList ID="rbPaymentMethods" runat="server"&gt;
        &lt;asp:ListItem&gt;Check&lt;img src="images/personalchecklrg.gif" alt="whatthebuttonmeans" /&gt;&lt;/asp:ListItem&gt;
        &lt;asp:ListItem&gt;Credit Card&lt;/asp:ListItem&gt;
    &lt;/asp:RadioButtonList&gt;

When the page is rendered this is what appears as the source

<table id=“ctl00_ContentPlaceHolder1_rbPaymentMethods” border=“0”>
<tr>
<td><input id=“ctl00_ContentPlaceHolder1_rbPaymentMethods_0” type=“radio” name=“ctl00$ContentPlaceHolder1$rbPaymentMethods” value=“Check<img src="images/personalchecklrg.gif" alt="whatthebuttonmeans" />” /><label for=“ctl00_ContentPlaceHolder1_rbPaymentMethods_0”>Check<img src=“images/personalchecklrg.gif” alt=“whatthebuttonmeans” /></label></td>
</tr><tr>
<td><input id=“ctl00_ContentPlaceHolder1_rbPaymentMethods_1” type=“radio” name=“ctl00$ContentPlaceHolder1$rbPaymentMethods” value=“Credit Card” /><label for=“ctl00_ContentPlaceHolder1_rbPaymentMethods_1”>Credit Card</label></td>
</tr>
</table>

4

Looking at it now it appears the Radio button list generates tables even if one does not include an image :confused:

5

I don’t know about ASP. How is this code being generated? What software are you using?

6

There you go then. Anyone out there who can help get rid of these unecessary tables?

7

Visual Studio 2005 ASP.NET 2.0

8

For all those interested:

There is a property on the RadioButtonLIST called RepeatLayout, it defaults to Table change this to Flow if you don’t want tables.

9