how to reorganize with twig a form builded in a custom module and keep working ajax callback?

Question

I've a form created programatically with a few fieldset and some inputs in these use ajax callback. The structure is like this :

$form['global']['controls'] = [
  '#type' => 'fieldset'
];

$form['global']['info'] = [
  '#type' => 'fieldset'
];

$form['global']['description'] = [
  '#type' => 'fieldset'
];

I've defined a theme template in my .module file and created the twig template. This is the twig template :

<div>
  {{ form.global.info }}
  {{ form.global.controls }}
  {{ form.global.description }}
</div>

The form display correctly but ajax callback don't work : the callback are executed but don't change the elements.

All callbacks work with this :

<div>
  {{ form }}
</div>

But I can't rearange the form with this twig code.

What I want is the possibility to rearange the order of the fieldsets in twig : put the fieldset 'description' before 'info', or 'controls' before 'info', etc. And keep ajax callbacks working.

Is it possible? And how?

Answer 1

The solution for this case was just to add {{ form|without('global') }} at the end of the .twig file, like this :

<div>
  {{ form.global.info }}
  {{ form.global.controls }}
  {{ form.global.description }}
</div>
{{ form|without('global') }}