Symfony 4 - Checkbox not in request, when not clicked (added via js ad prototype)

I'm trying to use checkboxes as a Collection.Actually, I'm using a checkbox Collection and a ChoiceField Collection together in one row.

The row symbolizes Childs. The Choice Field is used for the age and the checkbox for a "privileged" value.

I got one predefined row.With this row, everything works just fine.If I submit the form with the first child with an unchecked checkbox, I get the following data from the form:

"childs_age" => array:1 [▼    1 => 18  ]"childs_privileged" => array:1 [▼    1 => false  ]]

The checkbox is unchecked, but it is there and it has false as value

But when I add a row via "Add Child" Button, the values are only sent, if the checkboxes are clicked.If not, they don't exist.

"childs_age" => array:3 [▼    1 => 18    2 => 18    3 => 18  ]"childs_privileged" => array:1 [▼    1 => false  ]

So I already checked my html output and I can't find any differences (except of course the id):

//Child 1 Checkbox<div class="form-group row" id="childsupport_child_privileged_1_formgroup"><div class="col-sm-8" id="childsupport_child_privileged_1_label">privilegiert</div><div class="col-sm-2"><input type="checkbox" id="child_support_childs_privileged_1" name="child_support[childs_privileged][1]" value="privileged"></div><div class="col-sm-2"></div></div>[...]//Child 2 Checkbox<div class="form-group row" id="childsupport_child_privileged_2_formgroup"><div class="col-sm-8" id="childsupport_child_privileged_2_label">privilegiert</div><div class="col-sm-2"><input type="checkbox" id="child_support_childs_privileged_2" name="child_support[childs_privileged][2]" value="privileged"></div><div class="col-sm-2"></div></div>

My Code:

I'm using one Twig-File for the creation of the initial collection items and one for the prototype, when a row gets added in the front end. (Of course the php comments are not there, this is just for this post)

//main twig file//Adding the initial Childs in twig File[...]{% for childAgeField in childsupport_form.childs_age %}        {% set counter = ( counter | default(0) ) + 1 %}        {% include 'childsupport/childsupport.child.html.twig' with {'childAgeField': childAgeField, 'childPrivilegedField': childsupport_form.childs_privileged[counter], 'child_number': counter} %}    {% endfor %}[...]

And the used twig file:

<div class="form-group row" id="childsupport_child_age_{{child_number}}_formgroup"><div class="col-sm-12" id="childsupport_child_{{child_number}}_toplabel"><b>{% trans %}childsupport.child{% endtrans %} {{child_number}}</b></div><div class="col-sm-8" id="childsupport_child_age_{{child_number}}_label" for="childsupport_childs_age_{{child_number}}">{% trans %}childsupport.childAge{% endtrans %}</div><div class="col-sm-2">        {{ form_widget(childAgeField) }}</div>    {% if child_number > 1 %}<div class="col-sm-2" id="childsupport_child_{{child_number}}_delete"><span class="btn btn-danger" onclick="delete_child({{child_number}})">X</span></div>    {% else %}<div class="col-sm-2">&nbsp;</div>    {% endif %}</div><div class="form-group row" id="childsupport_child_privileged_{{child_number}}_formgroup"><div class="col-sm-8" id="childsupport_child_privileged_{{child_number}}_label" for="childsupport_childs_privileged_{{child_number}}">{% trans %}childsupport.privileged{% endtrans %}</div><div class="col-sm-2">        {{ form_widget(childPrivilegedField) }}</div><div class="col-sm-2"></div></div>

Creation of new rows:

[...]//Wrapper with both Fields<div class="js-child-wrapper" data-prototype="{{ formMacros.printChildRow(childsupport_form.childs_age.vars.prototype, childsupport_form.childs_privileged.vars.prototype, childsupport_form.childs_age|length+1)|e('html_attr') }}" data-index="{{ childsupport_form.childs_age|length }}"></div>[...]//makro for creation{% macro printChildRow(childAgeField, childPrivilegedField, child_number) %}    {% include 'childsupport/childsupport.child_prototype.html.twig' with {'childAgeField': childAgeField, 'childPrivilegedField': childPrivilegedField} %}{% endmacro %}

And the used twig file:

<div class="form-group row" id="childsupport_child_age___name___formgroup"><div class="col-sm-12" id="childsupport_child___name___toplabel"><b>{% trans %}childsupport.child{% endtrans %} __name__</b></div><div class="col-sm-8" id="childsupport_child_age___name___label" for="childsupport_childs_age___name__">{% trans %}childsupport.childAge{% endtrans %}</div><div class="col-sm-2">        {{ form_widget(childAgeField) }}</div>    {% if child_number > 1 %}<div class="col-sm-2" id="childsupport_child___name___delete"><span class="btn btn-danger" onclick="delete_child(__name__)">X</span></div>    {% else %}<div class="col-sm-2">&nbsp;</div>    {% endif %}</div><div class="form-group row" id="childsupport_child_privileged___name___formgroup"><div class="col-sm-8" id="childsupport_child_privileged___name___label" for="childsupport_childs_privileged___name__">{% trans %}childsupport.privileged{% endtrans %}</div><div class="col-sm-2">        {{ form_widget(childPrivilegedField) }}</div><div class="col-sm-2"></div></div>

Now the js File

function add_child(){    var wrapper = $('.js-child-wrapper');    var child_prototype = wrapper.data('prototype');    var index = wrapper.data('index');    var newChild = child_prototype.replace(/__name__/g, index+1);    $(newChild).insertAfter( "#childsupport_child_privileged_"+index+"_formgroup" );    wrapper.data('index', index + 1);    var i;    for (i = 0; i <= index; i++) {         $('#childsupport_child_'+i+'_delete').hide();    }}

So, actually everything seems to work fine.The new rows are displayed correctly, the html output should be right.

But something is missing.

Can someone help?

Thanks in advance!!!

P.S. I know, having two files for nearly the same purpose is not really best practice, but I didn't get it to work with one file.... But therefore, I have another question running ^^