Wilson
Wilson

Reputation: 65

Show a Radio Button with only Text

I have two radio buttons in my page. I hide one of them in some scenarios. In that case the second radio button is selected by default. In that case alone I want to show it like a label as there is no meaning of showing it as a radio button. I am using asp radio button. How to achieve this. can there is a way to hide the option bubble in CSS for radio button.

Upvotes: 1

Views: 963

Answers (4)

sms
sms

Reputation: 426

Try this: $('#<%=this.RadioButton.ClientID%>').hide()and $('#<%=this.RadioButton.ClientID%>').show().

Upvotes: 0

Deepak Sharma
Deepak Sharma

Reputation: 4170

check the fiddle if you want to do it using css and js

i mean on binding click event.

--JQuery--

$(function(){
    $("#click_me").click(function(){
        $("#a").toggle(0,function(){
            $(this).next('label').toggle(0,function(e){
                $(this).next('input[type="radio"]').toggle();
            });
        });
    });
})

Check the jfiddle

Upvotes: 1

SpiderCode
SpiderCode

Reputation: 10122

You can achieve it using JQuery. See below code sample. It will display only text :

<asp:RadioButton runat="server" Text="Radio 1" ID="radio1" />

<asp:Button runat="server" ID="buttonTest" OnClientClick="return ManageRadio();"/>

<script type="text/javascript">
    function ManageRadio() {
        $('#' + '<%=radio1.ClientID%>').hide();
        return false;
    }

</script>

Upvotes: 2

Arion
Arion

Reputation: 31239

considering this markup:

<asp:RadioButton ID="rbl" Text="value" CssClass="radio-toolbar" runat="server"/>

Then do this css style:

.radio-toolbar input[type="radio"] 
{
     display:none; 
}

this will only show the label of the radiobutton

Upvotes: 2

Related Questions