Set a CSS class on an ASP.NET RadioButtonList ListItem

Question

Is there any way to set a CSS class on an input item in a radio button list? I\'d like to reference these form values by class in jQuery.

Given an ASP.NET RadioButto

Answer 1

Yes, RadioButtonList renders horrible HTML.

Anyway, it's still easy to get them from jQuery.

Try

$('span.myclass input:radio')

Above will get all the radio buttons inside the span with class 'myclass'.

Answer 2

untested

$('.myclass input:radio').each(function() {
        this.css({'style-name':'style-value'})
)};

once the list is rendered, you can possibly manipulate the css client side using the above statement.

Answer 3

the desigeek response is pretty good..

To get this to work for radiobuttons I had to do this on document.ready()

$('#<%=radRisksMarginTrading.ClientID  %>_0').addClass("validate[required]");
$('#<%=radRisksMarginTrading.ClientID  %>_1').addClass("validate[required]");

I'm sure there is a much better way to do it by looping but I need a quick fix for 5 radiobutton lists..

Answer 4

Using .NET you could create an event handler to the RowBinding event. This would allow you to access the individual controls within each item in the list. Once you pull the RadioButton control, you could programaticaly set it's CssClass to apply your class on the RadioButton level.

You could also use jquery to find the radio button controls that have myClass applied, and then apply another class to that.

Third, you could just change the definition of MyClass to also specify that it's only applied to input elements under elements that have MyClass applied.

Answer 5

An alternative you may want to try to do is change your CSS class to accomindate the Server Control Rendering.

So in your CSS instead of the following:

.myClass { ... }

You Use this:

.myClass input { ... }

I don't know if you can set the class attribute (via class or CSSClass) in a declarative manner; however, the above should give you a work around.