Bonjour à toutes et tous,
Je rencontre une difficulté sur un fichier que je développe en JS pour un site.
Ce fichier est composé de 3 éléments :
1) index.html
2)calcul.js
3)affiner.js

1 et 2 fonctionnent parfaitement. Mais voila, sur le 3 j'ai un soucis de prise en compte de bouton radio.
L'appel à jquery et java renvoi un code 200. Donc tout va bien, mais lorsque je clique sur un bouton radio, rien ne se passe. J'ai fais un test sur https://jsfiddle.net/ qui me renvoi le même résultat, sans me signaler des erreurs. voici le code :

Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
function calculAffiner(cigarettesParJour, quantiteEliquideParFlacon, prixEliquide, nombreFlaconNicotine, prixFlaconNicotine, prixCigaretteElectronique) {
	console.log("Fonction calculAffiner appelée");
  // Calcule la quantité de eliquide consommée
  var quantiteEliquideConsommee = cigarettesParJour * 60 / quantiteEliquideParFlacon;
 
  // Calcule le coût de l'eliquide
  var coutEliquide = quantiteEliquideConsommee * prixEliquide;
 
  // Calcule le coût de la nicotine
  var coutNicotine = nombreFlaconNicotine * prixFlaconNicotine;
 
  // Calcule le coût total
  var coutTotal = coutEliquide + coutNicotine + prixCigaretteElectronique;
 
  // Retourne les résultats du calcul
  return {
    quantiteEliquideConsommee: quantiteEliquideConsommee,
    coutEliquide: coutEliquide,
    coutNicotine: coutNicotine,
    coutTotal: coutTotal,
  };
}
 
$(document).ready(function() {
	console.log("jQuery fonctionne correctement");
  // Lors du clic sur le bouton "Affiner",
  $("#valider").click(function() {
    // Récupère les valeurs des champs de saisie
    var cigarettesParJour = $("#cigarettesParJour").val();
    var quantiteEliquideParFlacon = $("#quantiteEliquide").val();
    var prixEliquide = $("#prixEliquide").val();
    var nombreFlaconNicotine = $("#nombreFlaconNicotine").val();
    var prixFlaconNicotine = $("#prixFlaconNicotine").val();
    var prixCigaretteElectronique = $("#prixCigaretteElectronique").val();
 
    // Exécute la fonction de calcul
    var resultats = calculAffiner(cigarettesParJour, quantiteEliquideParFlacon, prixEliquide, nombreFlaconNicotine, prixFlaconNicotine, prixCigaretteElectronique);
 
    // Affiche les résultats du calcul
    $("#quantiteEliquideConsommee").html(resultats.quantiteEliquideConsommee);
    $("#coutEliquide").html(resultats.coutEliquide);
    $("#coutNicotine").html(resultats.coutNicotine);
    $("#coutTotal").html(resultats.coutTotal);
  });
 
});
Celui qui en fait appel depuis le HTML est le suivant :
Code html : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
<head>
    <link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.13.2/themes/ui-darkness/jquery-ui.css">
    <link rel="stylesheet" media="screen" type="text/css" href="style/css.css" />
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
    <script src="js/calculateur.js"></script>
   <script src="js/affiner.js"></script>
</head>
 
<!-- HTML FONCTIONNEL POUR l'appel calcul.js -->
 
<!-- AFFINER LE CALCUL -->
 <div class="container">
 <h2>Comparateur Coût Cigarette Électronique</h2>
            <div class="form-group">
                <label for="quantiteEliquide">Quantité de eliquide dans un flacon (en ml) :</label>
                <input type="radio" id="quantiteEliquide10" name="quantiteEliquideParFlacon" value="10"> 10 ml
                <input type="radio" id="quantiteEliquide50" name="quantiteEliquideParFlacon" value="50"> 50 ml
            </div>
            <div class="form-group">
                <label for="prixEliquide">Prix de mon eliquide (en €) :</label>
                <input type="text" id="prixEliquide" placeholder="Saisissez le prix de votre eliquide">
            </div>
            <div class="form-group">
                <label for="nombreFlaconNicotine">Nombre de flacon de nicotine :</label>
                <input type="radio" id="nombreFlaconNicotine0" name="nombreFlaconNicotine" value="0"> 0
                <input type="radio" id="nombreFlaconNicotine1" name="nombreFlaconNicotine" value="1"> 1
                <input type="radio" id="nombreFlaconNicotine2" name="nombreFlaconNicotine" value="2"> 2
                <input type="radio" id="nombreFlaconNicotine3" name="nombreFlaconNicotine" value="3"> 3
            </div>
            <div class="form-group">
                <label for="prixFlaconNicotine">Prix d'un flacon de nicotine (en €) :</label>
				<input type="text" id="prixFlaconNicotine1" name="prixFlaconNicotine" placeholder="Saisissez le prix de votre eliquide nicotine">
            </div>
            <div class="form-group">
                <label for="prixCigaretteElectronique">Prix de votre cigarette électronique (en €) :</label>
                <input type="text" id="prixCigaretteElectronique" name="prixCigaretteElectronique" placeholder="Saisissez le prix de votre kit">
            </div>
<button type="button" class="ui-button ui-corner-all ui-widget" id="valider" onclick="calculAffiner()">Affiner</button>
 
</div>
.

Je tiens à préciser que F12 ne me renvoi également aucune erreur.
Je ne trouve pas le soucis...
Merci pour votre contribution