2014-01-15 154 views
3

就在這裏是我的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(); 
     } 
    }); 

所以,當我克隆此,我想知道如何將名稱屬性更改爲designator[1] ..因此添加一個。我不知道如何做到這一點,而仍然克隆和插入最後一個附加克隆後。

這裏是我引用弄清楚如何接受單選按鈕的數組的HTML:

Radio buttons + array elements

因爲我需要知道我可以在我的PHP for循環做的屬性和搶權指定者屬於它。

感謝您的幫助!

+0

http://api.jquery.com/attr/ –

+0

我知道有生成的attr()方法。我只是不確定如何在克隆操作發生之前這樣做,因爲在克隆之後,它會刪除第一個單選按鈕選項並將其放在該單選按鈕上,這樣每個選項都不能被選中。 – user3130415

回答

3

您可以通過評估存在多少個$('.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()方法)。

+0

他們是單選按鈕,而不是複選框,因爲我希望他們選擇或者使其成爲強制性的..而不是他們不必選擇是或否與複選框..它是每個條目的強制性。 – user3130415

+0

對不起,我的壞。一秒鐘,我正在爲您找到正確的解決方案。 – BenM

+0

@ user3130415請參閱編輯。 – BenM

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"); 
}); 
+0

這段代碼沒有任何作品。我甚至一次又一次地改變它,並且無法使它工作。 – user3130415