diff --git a/src/Bundle/ChillPersonBundle/Resources/public/vuejs/AccompanyingCourse/components/PersonsAssociated/ParticipationItem.vue b/src/Bundle/ChillPersonBundle/Resources/public/vuejs/AccompanyingCourse/components/PersonsAssociated/ParticipationItem.vue
index 155fd6c46..a278d00c4 100644
--- a/src/Bundle/ChillPersonBundle/Resources/public/vuejs/AccompanyingCourse/components/PersonsAssociated/ParticipationItem.vue
+++ b/src/Bundle/ChillPersonBundle/Resources/public/vuejs/AccompanyingCourse/components/PersonsAssociated/ParticipationItem.vue
@@ -128,7 +128,7 @@ export default {
             body.mobilenumber = payload.data.mobilenumber;
             body.email = payload.data.email;
             body.altNames = payload.data.altNames;
-            body.gender = payload.data.gender;
+            body.gender = {id: payload.data.gender.id, type: payload.data.gender.type };
             if (payload.data.civility !== null) { body.civility = {id: payload.data.civility.id, type: payload.data.civility.type }; }
 
             makeFetch('PATCH', `/api/1.0/person/person/${payload.data.id}.json`, body)
diff --git a/src/Bundle/ChillPersonBundle/Resources/public/vuejs/AccompanyingCourse/components/Resources/ResourceItem.vue b/src/Bundle/ChillPersonBundle/Resources/public/vuejs/AccompanyingCourse/components/Resources/ResourceItem.vue
index c2368d9ab..920287b86 100644
--- a/src/Bundle/ChillPersonBundle/Resources/public/vuejs/AccompanyingCourse/components/Resources/ResourceItem.vue
+++ b/src/Bundle/ChillPersonBundle/Resources/public/vuejs/AccompanyingCourse/components/Resources/ResourceItem.vue
@@ -153,7 +153,7 @@ export default {
             body.mobilenumber = payload.data.mobilenumber;
             body.email = payload.data.email;
             body.altNames = payload.data.altNames;
-            body.gender = payload.data.gender;
+            body.gender = {id: payload.data.gender.id, type: payload.data.gender.type };
             if (payload.data.civility !== null) { body.civility = {id: payload.data.civility.id, type: payload.data.civility.type}; }
 
             makeFetch('PATCH', `/api/1.0/person/person/${payload.data.id}.json`, body)
diff --git a/src/Bundle/ChillPersonBundle/Resources/public/vuejs/_components/OnTheFly/Person.vue b/src/Bundle/ChillPersonBundle/Resources/public/vuejs/_components/OnTheFly/Person.vue
index 59a0eca48..5a13820e9 100644
--- a/src/Bundle/ChillPersonBundle/Resources/public/vuejs/_components/OnTheFly/Person.vue
+++ b/src/Bundle/ChillPersonBundle/Resources/public/vuejs/_components/OnTheFly/Person.vue
@@ -73,17 +73,16 @@
    <!--  TODO fix placeholder if undefined
    -->
    <div class="form-floating mb-3">
-      <select
+     <select
          class="form-select form-select-lg"
          id="gender"
          v-model="gender"
-         @change="checkErrors"
-         >
-         <option selected disabled >{{ $t('person.gender.placeholder') }}</option>
-         <option value="woman">{{ $t('person.gender.woman') }}</option>
-         <option value="man">{{ $t('person.gender.man') }}</option>
-         <option value="both">{{ $t('person.gender.both') }}</option>
-      </select>
+     >
+       <option selected disabled >{{ $t('person.gender.placeholder') }}</option>
+       <option v-for="g in config.genders" :value="g.id" :key="g.id">
+         {{ g.label.fr }}
+       </option>
+     </select>
       <label>{{ $t('person.gender.title') }}</label>
    </div>
 
@@ -178,7 +177,7 @@
 </template>
 
 <script>
-import { getCentersForPersonCreation, getCivilities, getPerson, getPersonAltNames } from '../../_api/OnTheFly';
+import { getCentersForPersonCreation, getCivilities, getGenders, getPerson, getPersonAltNames } from '../../_api/OnTheFly';
 import PersonRenderBox from '../Entity/PersonRenderBox.vue';
 import AddAddress from "ChillMainAssets/vuejs/Address/components/AddAddress.vue";
 
@@ -204,6 +203,7 @@ export default {
             altNames: [],
             civilities: [],
             centers: [],
+            genders: []
          },
          showCenters: false, // NOTE: must remains false if the form is not in create mode
          showAddressFormValue: false,
@@ -237,8 +237,8 @@ export default {
          get() { return this.person.lastName; }
       },
       gender: {
-         set(value) { this.person.gender = value; },
-         get() { return this.person.gender; }
+         set(value) { this.person.gender = {id: value, type: 'chill_main_gender'}; },
+         get() { return this.person.gender ? this.person.gender.id : null; }
       },
       civility: {
          set(value) { this.person.civility = {id: value, type: 'chill_main_civility'}; },
@@ -334,6 +334,12 @@ export default {
                this.config.civilities = civilities.results;
             }
          });
+      getGenders()
+          .then(genders => {
+            if ('results' in genders) {
+              this.config.genders = genders.results;
+            }
+          });
       if (this.action !== 'create') {
          this.loadData();
       } else {