帶有克隆行的單選按鈕陣列

Question

我有一個表單，如果用戶單擊「添加行」，行就會變得模糊。我的問題是單選按鈕，收音機組的名稱保持不變，我需要爲每個克隆行獲得它們的唯一性。這是我目前的方式。

<input type="radio" name="chronic_l_duration[]" value="Chronic" /> 
<input type="radio" name="chronic_l_duration[]" value="Limited duration" /> 

我想什麼是這樣的：

<input type="radio" name="chronic_l_duration[1]" value="Chronic" /> 
<input type="radio" name="chronic_l_duration[1]" value="Limited duration" /> 

結束時，其他行被添加不言而喻：

<input type="radio" name="chronic_l_duration[2]" value="Chronic" /> 
<input type="radio" name="chronic_l_duration[2]" value="Limited duration" /> 

的Javascript我用克隆行：

$(document).ready(function(){ 
    var clonedRow = $('.row').clone().html(); 
    var appendRow = '<tr class = "row">' + clonedRow + '</tr>'; 

    $('#btnAddMore').click(function(){ 

    $('.employmentHistoryForm tr:last').after(appendRow); 
    }); 


    $('.deleteThisRow').live('click',function(){ 
    var rowLength = $('.row').length; 

    if(rowLength > 1){ 
    deleteRow(this); 
    }else{ 
    $('.employmentHistoryForm tr:last').after(appendRow); 
    deleteRow(this); 
    } 
    }); 

    function deleteRow(currentNode){ 
    $(currentNode).parent().parent().remove(); 
    } 
    }); 

所以每次行得到的c放棄單選按鈕具有獨特的價值。

有沒有辦法可以做到這一點？

Answer 1

您可以用$('.employmentHistoryForm tr:last')訪問附加行，然後修改輸入的名稱：

$('#btnAddMore').click(function(){ 
    $('.employmentHistoryForm tr:last').after(appendRow); 
    $('.employmentHistoryForm tr:last input[type="radio"]').attr('name', 'desired value'); 
});