多个动态创建的行上的单选按钮状态

Question

I have a form which has multiple rows generated by a query. Each row has a radio button group with three radio buttons.

What I am trying to do is to have each rows radio group work independantly of each other.

Example:

Row 1 (radio button 1) (radio button 2) (radio button 3)

Row 2 (radio button 1) (radio button 2) (radio button 3)

Row 3 (radio button 1) (radio button 2) (radio button 3)

At the moment if I click on any of the buttons in any of the rows its only row 1 that changes the status of the button.

My code:

do { 
    <input type="radio" name="action[<?php echo $row_TQ01['SeqID']; ?>]0" value="2" id="Action1_0" class="radio_item">
    <label class="label_item" for="Action1_0"> <img src="images/fix_2.png"> </label>
    <input name="action[<?php echo $row_TQ01['SeqID']; ?>]0" type="radio" class="radio_item" id="Action1_1" value="1" checked="CHECKED">
    <label class="label_item" for="Action1_1"> <img src="images/fail_2.png"> </label>
    <input type="radio" name="action[<?php echo $row_TQ01['SeqID']; ?>]0" value="0" id="Action1_2" class="radio_item">
    <label class="label_item" for="Action1_2"> <img src="images/pass_2.png"> </label>
} while ($row_TQ01 = mysql_fetch_assoc($TQ01)); 

I do have some CSS to dim or highlight the selected radio button but I have tested the code without the styling and is the same. my style is:

<style>
.radio_item{
    display: none !important;
}

.label_item {
opacity: 0.4;
}

.radio_item:checked + label {
opacity: 1;
}

label {
cursor: pointer;   
}

Can anyone see why only row 1 changes button status.

Many thanks in advance for your time.

Answer 1

the thing is in radio buttons the name should be same then only it works one at a time, if you keep all rows radio buttons name attribute same then it will work everywhere