onlar sayfa yüklemesinde DOM olmayan ikinci .each()
çağrı ek .multi-field
elemanları tanımıyor. Böyle bir şey yapacağını:
$('.multi-field-wrapper').each(function() {
var num = 1;
var $wrapper = $('.multi-fields', this);
$(".add-field", $(this)).click(function(e) {
num++;
$('.multi-field:first-child', $wrapper)
.clone(true)
.appendTo($wrapper)
.find('span')
.text('There are ' + num)
.parent()
.find('input')
.val('')
.focus();
});
$('.multi-field .remove-field', $wrapper).click(function() {
if ($('.multi-field', $wrapper).length > 1)
$(this).parent('.multi-field').remove();
});
});
Ve güncelleme HTML
<form role="form" action="/wohoo" method="POST">
<label>Stuff</label>
<div class="multi-field-wrapper">
<div class="multi-fields">
<div class="multi-field">
<span>There are 1</span>
<input type="text" name="stuff[]">
<button type="button" class="remove-field">Remove</button>
</div>
</div>
<button type="button" class="add-field">Add field</button>
</div>
</form>
için