Constraint Violation on dynamic form Symfony - ajax

Question

i work on Symfony3.4
I have a dynamic form country->region->city (3 distincts entities).
I can change fields based on user selection without any problem.
But i can't persist in database because of a constraint violation on the field city (and only this field)
And I realy don't know why because I call them (region and city) the same way...
Any help would be welcome.
Here is the Form :
public function buildForm(FormBuilderInterface $builder, array $options)
{
$em = $options['entityManager'];
$builder
->add('rue', TextType::class, array(
'label' => 'votre rue',
'required' => true,
))
->add('pays', EntityType::class, array(
'class' => 'AppBundle\Entity\Pays',
'placeholder' => '--choisir--',
'choice_label' => 'nom',
'required' => true
))
;
$addRegion = function (FormInterface $form, Pays $pays = null) {
$regions = null === $pays ? array() : $pays->getRegions();
$form->add('region', EntityType::class, array(
'class' => 'AppBundle\Entity\Region',
'placeholder' => '--choisir une région--',
'choices' => $regions,
'choice_label' => 'nom',
'required' => true
));
};
$addVille = function (FormInterface $form, Region $region = null) {
$villes = null === $region ? array() : $region->getVilles();
$form->add('ville', EntityType::class, array(
'class' => 'AppBundle\Entity\Ville',
'placeholder' => '--choisir une ville--',
'choices' => $villes,
'choice_label' => 'nom',
'required' => true
));
$form->add('submit', SubmitType::class
);
};
$builder->addEventListener(
FormEvents::PRE_SET_DATA,
function (FormEvent $event) use ($addRegion, $addVille){
$form = $event->getForm();
$addVille($form, null);
$addRegion($form, null);
}
);
$builder->addEventListener(
FormEvents::PRE_SUBMIT,
function (FormEvent $event) use ($addRegion, $addVille, $em) {
$form = $event->getForm();
$data = $event->getData();
if(isset($data['pays'])){
$paysId = $data['pays'];
$repo = $em->getRepository('AppBundle\Entity\Pays');
$pays = $repo->find($paysId);
$addRegion($form, $pays);
$addVille($form, null);
}
else if(isset($data['region'])){
$regionId = $data['region'];
$repo = $em->getRepository('AppBundle\Entity\Region');
$region = $repo->find($regionId);
$addVille($form, $region);
}
}
);
}
And here is the Template :
{% block body %}
{% form_theme form 'bootstrap_4_layout.html.twig' %}
{% for message in app.flashes('notice') %}
<div style="color:green;">
{{ message }}
</div>
{% endfor %}
{{ form_start(form) }}
{{ form_errors(form) }}
{{ form_end(form) }}
{% endblock %}
{% block javascripts %}
<script>
var $pays = $('#adresse_pays');
var $region = $('#adresse_region');
var $ville = $('#adresse_ville');
$pays.change(function() {
var $form = $(this).closest('form');
var data = {};
data[$pays.attr('name')] = $pays.val();
// Submit data via AJAX to the form's action path.
$.ajax({
url : $form.attr('action'),
type: $form.attr('method'),
data : data,
success: function(html) {
$ville.empty()
var select = $(html).find('#adresse_ville > option')
$ville.append(select)
$region.empty()
var select = $(html).find('#adresse_region > option')
$region.append(select)
$region.val($("#adresse_region option:first").val());
console.log('regions')
console.log(select)
}
});
});
$region.change(function() {
var $form = $(this).closest('form');
var data = {};
data[$region.attr('name')] = $region.val();
// Submit data via AJAX to the form's action path.
$.ajax({
url : $form.attr('action'),
type: $form.attr('method'),
data : data,
success: function(html) {
$ville.empty()
var select = $(html).find('#adresse_ville > option')
$ville.append(select)
$ville.val($("#adresse_ville option:first").val());
console.log('villes')
console.log(select)
}
});
});
</script>
{% endblock %}
This is the alert on the form (next to city field) :
Error This value is not valid
I went further thanks to the debug bar, and it seems that this field does not send an object but an integer.
The difference i found with another field is that in the city field :
Normalized Format submitted is null
while in another field such as region :
Normalized Format
Region {#6035 ▼
-id: 3
-nom: "Catalogne"
-villes: PersistentCollection {#6039 …}
-pays: Pays {#5802 ▶}
-adresses: PersistentCollection {#6041 …}
}

Answer 1

It works !
i split the function
$builder->addEventListener(
FormEvents::PRE_SUBMIT, ... in half => i remove the else if and made another similar function to listen when "region" is changed.
What bothers me is I don't understand why it works this way but not the other way...
$builder->addEventListener(
FormEvents::PRE_SUBMIT,
function (FormEvent $event) use ($addRegion, $addVille, $em) {
$form = $event->getForm();
$data = $event->getData();
if(isset($data['pays'])){
$paysId = $data['pays'];
$repo = $em->getRepository('AppBundle\Entity\Pays');
$pays = $repo->find($paysId);
$addRegion($form, $pays);
$addVille($form, null);
}
}
);
$builder->addEventListener(
FormEvents::PRE_SUBMIT,
function(FormEvent $event) use ($addVille, $em) {
$form = $event->getForm();
$data = $event->getData();
if(isset($data['region'])){
$regionId = $data['region'];
$repo = $em->getRepository('AppBundle\Entity\Region');
$region = $repo->find($regionId);
$addVille($form, $region);
}
}
);