I have a form with multiple input array id's
for example:
<div>
<input name='set1[]'>
<input name='set2[]'>
<input name='set3[]'>
</div>
<div>
<input name='set1[]'>
<input name='set2[]'>
<input name='set3[]'>
</div>
The problem I have is if I leave out one of my sets my array key position is '0' instead of '1'. Use below as an example:
<div>
<input name='set1[]'>
<input name='set2[]'>
</div>
<div>
<input name='set1[]'>
<input name='set2[]'>
<input name='set3[]'>
</div>
When set 3 isn't in the first div, set 3 key value is '0' when I need it to be '1'.
I am using Jquery to append each 'set'. Any ideas on how to get the 'set3[]' to be key value '1'?
here is my Jquery:
$(document).ready(function() {
var max_fields = 9; //maximum input boxes allowed
var wrapper = $(".input_fields_wrap_ex1"); //Fields wrapper
var add_button = $(".add_field_button_ex1"); //Add button
$(document).on("click", ".add_field_button_ex1", function (e) { //on add input button click
var num = $(this).parents().children('.setsdiv').length;
var index = $(this).parent().parent().parent().siblings().children().index('#myinputwkout');
alert(index);
e.preventDefault();
if ($(this).parents().children('.setsdiv').length < max_fields) { //max input box allowed
$container=$(this).parent().parent().parent();
$container.append('<div id="setsdiv" class="col-xs-12 text-center setsdiv"><div class="col-xs-3 col-sm-4 nopad"><input id="set" class="form-control input-sm setinput text-center col-xs-6 set" type="text" name="sets'+ num +'[]" placeholder="Weight" pattern="\\d*"></div><div class="col-xs-3 col-sm-4 nopad"><input id="reps" class="form-control input-sm setinput text-center col-xs-6 reps" type="text" name="reps'+ num +'[]" placeholder="Reps" pattern="\\d*"></div><div class="col-xs-6 col-sm-4"><a class="btn btn-xs btn-default remove_field pull-right">Remove</a><a class="same btn btn-xs btn-default" href="#">Same</a></div></div>'); //add input box
$container.find('.set:last').focus();
}
});
$(document).on("click", ".remove_field", function (e) { //user click on remove text
e.preventDefault();
$(this).closest('.setsdiv').remove();
})
$(document).on("click", ".same", function (e) { //user click on same text
e.preventDefault();
//Get
var set = $(this).parent().parent().prev().find('#set').val();
var rep = $(this).parent().parent().prev().find('#reps').val();
//Set
$(this).parent().siblings().children('#set').val(set);
$(this).parent().siblings().children('#reps').val(rep);
})
});
</div>