ASP.NET RadioButtonList generating extra HTML for a ListItem that contains an image

Question

In my application I have a RadioButtonList:

<asp:RadioButtonList runat="server" ID="CardTypeRadioButtonList" RepeatDirection="Horizontal">
    <asp:ListItem Value="Visa">
        <img src="../images/icon_visa.gif" alt="Visa" align="absmiddle">&nbsp;Visa
    </asp:ListItem>
    <asp:ListItem Value="MasterCard">
        <img src="../images/icon_mc.gif" alt="MasterCard" align="absmiddle">&nbsp;Mastercard
    </asp:ListItem>
</asp:RadioButtonList>

However, sometimes Visual Studio generates the following code automatically and inserts it into my ListItems:

<img src="../images/icon_visa.gif" alt="Visa" align="absmiddle"> Visa

Any idea how to make this go away?

Answer 1

you are missing '<' at the second 'img' tag

<asp:RadioButtonList runat="server" ID="CardTypeRadioButtonList" RepeatDirection="Horizontal">
<asp:ListItem Value="Visa">
    <img src="../images/icon_visa.gif" alt="Visa" align="absmiddle"> Visa
</asp:ListItem>
<asp:ListItem Value="MasterCard">
   <img src="../images/icon_mc.gif" alt="MasterCard" align="absmiddle"> Mastercard
</asp:ListItem>

Answer 2

I tried putting a blank Text attribute on each ListItem. Hopefully this makes this issue go away.

Answer 3

I had a similar issue with Telerik controls about a year ago and ended up writing a macro to fix it as needed because I couldn't figure it out. That's not the best solution but if you can't figure out what to do its very easy to create a macro to repair the code as needed in Visual Studio.