Как узнать, какую радиокнопку пользователь выбрал в Javascript?

Question

У меня есть форма, которая выглядит как этот

Прямо сейчас, проблема, которую я имею, что пользователь может выбрать более 1 переключатель. Они должны только выбрать 1. У меня есть функция Javascript, которая будет проходить через все строки и отключить кнопку, которая не была выбрана, как показано здесь.

function disableNonSelectedRadioButtons(selectedRadioButton) { 
    $('#payer-contract-global-table .clone-target').each(function (i) { 
     var radioName = 'radio' + '-c' + i; 
     if (selectedRadioButton != radioName) 
      $('#' + radioName).prop("checked", false); 
    }); 
} 

Это работает. Но мне нужно отправить правильную selectedRadioButton на эту функцию. Как я могу правильно это сделать в Javascript?

В настоящее время HAML выглядит следующим образом:

%input.radio-button{:name => "radio-c#{index}", :type => "radio", :id => "radio-c#{index}", :checked => "true"} 

Есть некоторый тип кода в JavaScript, что я могу сделать, что говорит, что если я нажимаю кнопку radio-c2 он посылает, что моя функция?

Answer 1

Если вы обнаружите, что это событие не срабатывает, это происходит потому, что элемент DOM генерируются динамически (я думаю ...) я решаю так:

$(document).on('click', 'input[type="radio"]', function(e){ 
    var selectedRadioName = $(this).attr('name'); 
    disableNonSelectedRadioButtons(selectedRadioName); 
}); 

на всякий случай.

Answer 2

Вы можете использовать prop()

$('input[type="radio"]').click(disableNonSelectedRadioButtons($(this).prop('name'))); 

Answer 3

Если вы хотите использовать JQuery:

$('input[type="radio"]').click(function(e){ 
     var selectedRadioName = $(this).attr('name'); 
     disableNonSelectedRadioButtons(selectedRadioName); 
    }); 

Если вы создаете элементы динамически, делегирование использование событий: https://learn.jquery.com/events/event-delegation/

$(document).on('click', 'input[type="radio"]', function(e){ 
     var selectedRadioName = $(this).attr('name'); 
     disableNonSelectedRadioButtons(selectedRadioName); 
}); 

Это сказал, вы можете просто использовать HTML для этого:

<input type="radio" name="giveThemAllTheSameName" /> 

Давая радиокнопкам одноименное имя, вы можете только выбрать.