Question

My page has about 25 radio button groups. When a radio button is selected in a group, I want to perform an action Specific to that group, and so need the NAME attrib of the radio group.

Answer 1

Take this HTML for example :

<div id="stackExchange">
  <input type="radio" name="sofu_group" value="Stack Overflow">
  <input type="radio" name="sofu_group" value="Meta Stack Overflow">
  <input type="radio" name="sofu_group" value="Server Fault">
  <input type="radio" name="sofu_group" value="Super User">
</div>
<!-- In no particular order - don't want to start a flame war ;) -->

If you wanted to deduce what group the clicked radio button belongs to you could use something like this :

// jQuery ver 1.7+
$("#stackExchange input:radio").on('click',function(){   
  var groupName = $(this).attr('name');
  var groupElements = $(this).parent().find(":radio[name='"+groupName+"']");
});

Lets see whats going on here :

• $("#stackExchange input:radio") – this selector will find us all of the input radio elements that are decendants of the #stackExchange element using the :radio selector. (Link to docs).
• $(this).attr('name') – here is where we extract the name attribute of the selected radio element. (In our example – this becomes sofu_group).
• $(this).parent() – In this case the variable $(this) refers to the radio element that was clicked – so we are selecting its parent – the #stackExchange element.
• parent().find(":radio[name='"+groupName+"']") – this line will find all of the radio buttons held within the element that have a name attribute set to ‘sofu_group’.

_{In the example – the variable $(this) refers to the radio element that was clicked.}