Symfony custom fields on add - forms

Question

On my Symfony2 project I got a list of arguments :
<ul class="arguments" data-prototype="{{ form_widget(form.arguments.vars.prototype)|e('html_attr') }}">
{% for argument in form.arguments %}
{#<li>{{ form_row(argument) }}</li>#}
<li>
{{ form_row(argument.name, {'label': 'Name'}) }}
{{ form_row(argument.french_description) }}
{{ form_row(argument.english_description) }}
{{ form_row(argument.return) }}
{{ form_row(argument.type) }}
</li>
{% endfor %}
</ul>
But I got a button "Add arguments", creating a new < li >< /li > with arguments fields. The problem is the new argument don't got the custom label "Name".
EDIT :
I add the arguments with a buton calling a JS function to add my fields on the page. Then when I click on submit it save it to database.
$('#add_argument_link').on('click', function(e) {
// prevent the link from creating a "#" on the URL
e.preventDefault();
// setup an "add a argument" link
var $newLinkLi = $('<li></li>');
// add a new argument form (see next code block)
addArgumentForm($collectionHolder, $newLinkLi);
addTagFormDeleteLink($newLinkLi);
});
Thanks for your help.

Answer 1

You can try something like that :
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
var $container = $('div#name_of_your_div');
var index = $container.find(':input').length;
$('#add_argument').click(function(e) {
addArgument($container);
e.preventDefault();
return false;
});
if (index == 0) {
addArgument($container);
} else {
$container.children('div').each(function() {
addDeleteLink($(this));
});
}
function addArgument($container) {
var template = $container.attr('data-prototype')
.replace(/__name__label__/g, 'Argument number' + (index+1))
.replace(/__name__/g, index);
var $prototype = $(template);
addDeleteLink($prototype);
$container.append($prototype);
index++;
}
function addDeleteLink($prototype) {
var $deleteLink = $('Delete');
$prototype.append($deleteLink);
$deleteLink.click(function(e) {
$prototype.remove();
e.preventDefault();
return false;
});
}
});
</script>