can anyone please advise what may be wrong with my script below?
It should look for the last DIV with #objec in the class name, and then look for the last input element within the DIV, then add a new DIV with incremented ID/Names below the one there already. I think this is the line which is going wrong:
var name = $("#objec:last>input").attr("name");
The code is here: http://jsfiddle.net/mtait/9MbQH/6/
…and below.
Thank you,
Mark
<label id="add_tag">
Click me to add a new row
</label>
<div class="objec">
<div class="row">
<div class="span4">
<input class="span4" data-val="true" data-val-required="Objective is required" id="Objectives_7__objective" name="Objectives[7].objective" type="text" value="Timecard Completion" />
</div>
</div>
</div>
$(document).ready(function() {
var re = /\[(.*?)\]/;
$("#add_tag").click(function() {
var name = $("#objec:last>input").attr("name");
var m = re.exec(name);
var itemNumber = parseInt(m[1]) + 1;
var $newdiv1 = $('<div class="objec"><div class="row"><div class="span4"><input class="span4" data-val="true" data-val-required="Objective is required" id="Objectives_' + itemNumber + '__objective" name="Objectives[' + itemNumber + '].objective" type="text" value="..." /></div></div>');
$(".objec:last").after($newdiv1);
return false;
});
});
Probably you want this:
Live demo
Read about the differences between Descendant combinator and Child combinators.