katie hudson
katie hudson

Reputation: 2893

Cloning Divs and changing labels

I have set up the following fiddle. https://jsfiddle.net/yvnyk69v/3/

As you can see, I have three divs containing an input and a checkbox. Each div is independent of each other meaning that their labels should not be determined by another divs count. In the example, you can see that I have given Group 1 an id of group1Row. This allows each cloned input to have a label with the count added to the end of it. So the first label is Group One and the second Group One 1.

I do not think the id approach is the right approach here however. At the moment, I am getting the count using

var cloneG1 = $("#group1Row .clone");
var cnt = cloneG1.length + 1;

Now I cant really do this for each individual id. I am trying to achieve what I have working for the first Group for all groups. So, if you add a new row to Group 2, the label should start at 1 again, and not from what the previous group got up too. Instead of ids, I think it would probably make sense using $(this) somehow.

What would be the best way to increment a value for each div?

Thanks

Upvotes: 0

Views: 47

Answers (1)

mehulmpt
mehulmpt

Reputation: 16567

I've updated your fiddle. The code seems to work dynamically now. I've changed the following line:

var cloneG1 = $(this).parent().parent().find('.clone').length;
var cnt = cloneG1 + 1;

https://jsfiddle.net/yvnyk69v/4/

Upvotes: 1

Related Questions