Использование изображений вместо кнопки радио

Question

Я очень новичок в ASP и имеют следующий код:

<tr> 
    <td style="padding-bottom:5px;">Would you return to this practice again?&nbsp;&nbsp;<asp:RequiredFieldValidator SetFocusOnError="true" ID="rfvReturn" runat="server" ControlToValidate="rblReturn" ErrorMessage="*" ForeColor="Red" Font-Bold="true" Display="Dynamic" /></td> 
    <td style="padding-bottom:5px;"> 
    <asp:RadioButtonList runat="server" ID="rblReturn" RepeatDirection="Horizontal"> 
     <asp:ListItem Value="true" Text="Yes" /> 
     <asp:ListItem Value="false" Text="No" /> 
    </asp:RadioButtonList> 
    </td> 
</tr> 
<tr class="spaceUnder"> 
    <td style="padding-bottom:5px;">Would you refer a friend to this practice?&nbsp;&nbsp;<asp:RequiredFieldValidator SetFocusOnError="true" ID="rfvRefer" runat="server" ControlToValidate="rblRefer" ErrorMessage="*" ForeColor="Red" Font-Bold="true" Display="Dynamic" /></td> 
    <td style="padding-bottom:5px;"> 
    <asp:RadioButtonList runat="server" ID="rblRefer" RepeatDirection="Horizontal"> 
     <asp:ListItem Value="true" Text="Yes" /> 
     <asp:ListItem Value="false" Text="No" /> 
    </asp:RadioButtonList> 
    </td> 
</tr> 

Этот код создает следующее:

То, что я хотел бы сделать заменяет радиообъекты изображениями, которые переключаются и выглядят следующим образом:

Я искал везде, но, похоже, не могу найти способ сделать это.

Answer 1

Это может быть неправильный способ сделать это, но как насчет того, чтобы изображения были ссылками на функцию javascript. Эта функция может заполнить текстовое поле либо 0, либо 1, на основе которого была нажата кнопка.

function radiobutton() { 
     document.getElementById("radiotext").value="1"; 
} 

, а затем просто скрыть текстовое поле:

<div style="width: 0; height: 0; overflow: hidden;"> 
<input type="text"> 
</div> 

Это должно работать ...