Solved

RadioButton Group

Posted on 2014-07-25
3
320 Views
Last Modified: 2014-07-25
The attached image shows some buttons put in a panel control.

Question: Is it possible to modify this button assembly to behave like a set of radiobuttons?

If yes, how what are the changes I need to apply to it?

Thank you.
#btn1, #btn3, #btn5
{
     Height:30px;
     Width:103px;
     margin: 2px auto 0px auto;
}
.
.                
<panel type="radio" name="opt" ID="btnOpt"> 
      <td><asp:Button ID="btn1" Name="opt" runat="server" Text="1" TabIndex="1"   /></td>
      <td><asp:Button ID="btn3" Name="opt" runat="server" Text="3" TabIndex="3"  /></td>
      <td><asp:Button ID="btn5" Name="opt" runat="server" Text="5" TabIndex="5"  /></td>
</panel>

after I revised it to:
 <td><asp:radioButton ID="btn1"  GroupName="cmdOpt" Name="opt" runat="server" Text="1" TabIndex="1"   /></td>
 <td><asp:radioButton ID="btn3"  GroupName="cmdOpt" Name="opt" runat="server" Text="3" TabIndex="3"  /></td>
 <td><asp:Button ID="btn5"  GroupName="cmdOpt" Name="opt" runat="server" Text="5" TabIndex="5"  /></td>

Open in new window

I am getting the second image (radioButton2) where the radio button assembly is functioning but it looses css.
radioButton.png
radioButton2.png
0
Comment
Question by:Mike Eghtebas
  • 2
3 Comments
 
LVL 82

Accepted Solution

by:
Dave Baldwin earned 500 total points
ID: 40220963
Radio buttons have a check circle beside them, not a number inside a button.  I don't think you can make it look like the first version and act like radio buttons unless you write some javascript to make that happen.
More info here: http://www.w3schools.com/html/html_forms.asp
0
 
LVL 33

Author Comment

by:Mike Eghtebas
ID: 40220970
Thanks
0
 
LVL 82

Expert Comment

by:Dave Baldwin
ID: 40221009
I don't know C#, I thought it was a javascript problem.
0

Featured Post

How to run any project with ease

Manage projects of all sizes how you want. Great for personal to-do lists, project milestones, team priorities and launch plans.
- Combine task lists, docs, spreadsheets, and chat in one
- View and edit from mobile/offline
- Cut down on emails

Join & Write a Comment

SASS allows you to treat your CSS code in a more OOP way. Let's have a look on how you can structure your code in order for it to be easily maintained and reused.
Real-time is more about the business, not the technology. In day-to-day life, to make real-time decisions like buying or investing, business needs the latest information(e.g. Gold Rate/Stock Rate). Unlike traditional days, you need not wait for a fe…
In this tutorial viewers will learn how to embed an audio file in a webpage using HTML5. Ensure your DOCTYPE declaration is set to HTML5: : The declaration should display (CODE) HTML5 is supported by the most recent versions of all major browsers…
In this tutorial viewers will learn how to style rounded corners for elements in CSS using the border-radius property Begin with a normal styled element such as a div: To style all four corners of the div to be the same degree of roundness, use the …

705 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

19 Experts available now in Live!

Get 1:1 Help Now