Радиокнопка не работает (Можно выбрать несколько кнопок радио одновременно)

Question

У меня есть следующий HTML:

<table> 
 
    <tr> 
 
     <td>Sys/Prod/Proc :</td> 
 
     <td width="10px"></td> 
 
     <td><input type="radio" value="A"/></td> 
 
     <td width="10px"></td> 
 
     <td><input type="text" class="form-control"/></td> 
 
    </tr> 
 
    <tr height="10px"></tr> 
 
    <tr> 
 
     <td>Sub-Sys/Prod/Proc :</td> 
 
     <td width="10px"></td> 
 
     <td><input type="radio" value="B"/></td> 
 
     <td width="10px"></td> 
 
     <td><input type="text" class="form-control"/></td> 
 
    </tr> 
 
    <tr height="10px"></tr> 
 
    <tr> 
 
     <td>Component :</td> 
 
     <td width="10px"></td> 
 
     <td><input type="radio" value="C"/></td> 
 
     <td width="10px"></td> 
 
     <td><input type="text" class="form-control"/></td> 
 
    </tr> 
 
</table>

Рентгено кнопки у меня не работает, как ожидалось. Теперь я могу выбрать несколько переключателей вместо одного. Как я могу это исправить?

Answer 1

Для каждого переключателя должен быть одинаковый атрибут name, чтобы они действовали взаимоисключающим образом.

<table> 
 
    <tr> 
 
    <td>Sys/Prod/Proc :</td> 
 
    <td width="10px"></td> 
 
    <td><input type="radio" name="radio" value="A" /></td> 
 
    <td width="10px"></td> 
 
    <td><input type="text" class="form-control" /></td> 
 
    </tr> 
 
    <tr height="10px"></tr> 
 
    <tr> 
 
    <td>Sub-Sys/Prod/Proc :</td> 
 
    <td width="10px"></td> 
 
    <td><input type="radio" name="radio" value="B" /></td> 
 
    <td width="10px"></td> 
 
    <td><input type="text" class="form-control" /></td> 
 
    </tr> 
 
    <tr height="10px"></tr> 
 
    <tr> 
 
    <td>Component :</td> 
 
    <td width="10px"></td> 
 
    <td><input type="radio" name="radio" value="C" /></td> 
 
    <td width="10px"></td> 
 
    <td><input type="text" class="form-control" /></td> 
 
    </tr> 
 
</table>