I'm trying to get datas from a form with ajax request but it doesn't work, can you explain me what is wrong with my code please, I'll be greatful for your help. Thank you in advance
My form looks like
<form id="example-form" action="info.php">
<select name="options">
<option value="Douleur">Douleur</option>
<option value="Stress">Stress/anxiété</option>
<option value="Sommeil">Sommeil</option>
<option value="Life style">Life style /Bien être</option>
<option value="Addiction">Addiction</option>
<option value="Problèmes de peau">Problèmes de peau</option>
<option value="Sport">Sport</option>
<option value="Animaux">Animaux</option>
</select>
<input name="username" type="text" placeholder="Username">
<button type="submit">Envoyer</button>
</form>
and my script
const form = document.getElementById('example-form');
const url = form.action;
const formData = new FormData(form);
form.onsubmit = async (e) => {
e.preventDefault();
try {
const plainFormData = Object.fromEntries(formData.entries());
const formDataJsonString = JSON.stringify(plainFormData);
let response = await fetch(url, {
method: 'POST',
headers: {
'Content-Type': 'application/json'
},
body: formDataJsonString
});
console.log(response.text());
} catch (error) {
console.error(error);
}
}