Изменить название кнопки радио после Jquery клона()

Question

Вот здесь мой HTML ::

<fieldset> 
    <legend>Attributes</legend> 

    <div class="attr_container"> 
     <div class="attr_entry existent row"> 
      <div class="half"> 
       <label for="attribute[]">Attribute</label> 
       <input id="attribute" maxlength="50" required="required" name="attribute[]" type="text">     
       <p> 
        <a href="javascript:void(0)" class="add_attr"><i class="fa fa-plus-circle"></i> Add Another Attribute</a> 
        <span class="remove">| 
        <a href="javascript:void(0)" class="remove_attr"><i class="fa fa-minus-circle"></i> Remove</a></span> 
       </p> 
      </div> 
      <div class="half"> 
       <label for="designator">Is this attribute a designator?</label>    <input checked="checked" name="designator[0]" type="radio" value="0" id="designator[0]"> No 
       <input name="designator[0]" type="radio" value="1" id="designator[]"> Yes 
      </div> 
     </div> 
    </div> 

</fieldset> 

Вот мой JQuery:

$('.add_attr').click(function() { 
     // clone and add 
     $(".attr_entry:first").clone(true).removeClass('existent').insertAfter(".attr_entry:last"); 
    }); 

    $('.remove_attr').click(function() { 
     // remove entry 
     if($(this).parents('.attr_entry').first().hasClass('existent')) { 
      alert('You can not remove the first attribute entry.'); 
     } else { 
      $(this).parents(".attr_entry").first().remove(); 
     } 
    }); 

Так что, когда я клонировать это, я хочу знать, как изменить атрибут name на designator[1] .. поэтому добавив один к этому. Я не уверен, как это сделать, все еще клонируя и вставляя после последнего добавленного клона.

Вот HTML я ссылаться, чтобы выяснить, как принять массив радио-кнопок:

Radio buttons + array elements

Потому что мне нужно знать, атрибут, который я могу сделать в моем PHP для цикла и захватить право который принадлежит ему.

Спасибо за помощь!

Answer 1

Вы можете получить новый индекс, оценив количество элементов $('.attr_entry'). Затем вы можете комбинировать find() и prop(), чтобы установить имя переключателей.

Изменить свой clone() строку следующим образом:

var newIndex = $('.attr_entry').length; 
$('.attr_entry:first').clone(true).removeClass('existent').insertAfter('.attr_entry:last').find('input[type="radio"]').prop('name', 'designator['+newIndex+']'); 

jsFiddle Demo

Обратите внимание, что атрибут id для элементов должен быть уникальным, так что вы, возможно, захотите рассмотреть вопрос об обновлении, что в то же самое время (используя тот же метод prop()).

Answer 2

Не слишком знакомы с клоном в jquery. Вы можете установить атрибуты с помощью функции attr().

Так что ваш код будет выглядеть примерно так:

var designatorIndex = 0; 
$('.add_attr').click(function() { 
    // clone and add 

    var myVar = $(".attr_entry:first").clone(true).removeClass('existent'); 

    $(myVar).attr('name', 'designator' + designatorIndex); 
    $(myVar).id('designator' + designatorIndex); 
    designatorIndex++; 
    $(myVar).insertAfter(".attr_entry:last"); 
});