Comment fusionner deux champs avec le même nom mais des identifiants différents dans la même ligne dans MySQL ?

Question

J'ai un projet dans lequel le client peut sélectionner un prix en fonction d'une case à cocher et la zone de saisie porte le même nom, Si je coche la case mais que je n'ai aucune entrée, je souhaite uniquement stocker la valeur de la case à cocher dans la base de données, si je sélectionne la zone de saisie, je souhaite uniquement stocker la valeur de la zone de saisie. Voici mon code :

<ul class="donate-now">[enter image description here](https://i.stack.imgur.com/EyU7O.png)
                  <li>
                    <input type="radio" class="form-control btn-default target" id="a100" name="amount" value="100"/>
                    <label for="a25">100€/mois</label>
                  </li>
                  <li>
                    <input type="radio" class="form-control btn-default target" id="a200" name="amount" value="200" />
                    <label for="a50">200€/mois</label>
                  </li>
                  <li>
                    <input type="radio" class="form-control btn-default target" id="a300" name="amount" value="300" checked/>
                    <label for="a75">300€/mois</label>
                  </li>
                 
                </ul>
                </div>
              
            
                
                <div class="container form-control-lg" id="montant-libre">
                  <span class="input-symbol-euro"><input type="text" class="form-control form-control-md" style="color: #d34607;" id="montantlibre" onclick="clearRadio()"  placeholder="Montant libre" name="amount" min="1"/></span>
                  
                </div>

Dois-je apporter quelques modifications sur mon MySQL puisque je continue à recevoir des erreurs ?

Answer 1

<form id="donate">
   <ul class="donate-now">
      <li>
         <input type="radio" class="form-control btn-default target" id="a100" name="amount" value="100"/>
         <label for="a25">100€/mois</label>
      </li>
      <li>
         <input type="radio" class="form-control btn-default target" id="a200" name="amount" value="200" />
         <label for="a50">200€/mois</label>
      </li>
      <li>
         <input type="radio" class="form-control btn-default target" id="a300" name="amount" value="300" checked/>
         <label for="a75">300€/mois</label>
      </li>
   </ul>
   <div class="container form-control-lg" id="montant-libre">
      <span class="input-symbol-euro">
      <input type="text" class="form-control form-control-md" style="color: #d34607;" id="montantlibre" onclick="clearRadio()"  placeholder="Montant libre" name="amount" min="1"/>
      </span>
   </div>
</form>
<script>
   // 获取表单元素
   var form = document.getElementById("donate");
   if (form) {
   // 为表单添加提交事件监听器
   form.addEventListener("submit", function(event) {
     // 获取选中的单选按钮
     var selectedRadio = document.querySelector('input[name="amount"]:checked');
   
     // 获取输入字段
     var inputField = document.getElementById("montantlibre");
     var amount = selectedRadio.value;
     // 检查输入字段是否有值
     if (!Number(inputField.value) !== true) {
       // 新值
        amount = inputField.value;
     }
   
     console.log(amount);
     // 阻止默认的表单提交
     event.preventDefault();
   });
   }
</script>

Détails :

1- Utilisez document.getElementById("donate") pour obtenir des éléments de formulaire.

2- Utilisez form.addEventListener("submit", function(event) { ... }); pour ajouter un écouteur d'événement de soumission au formulaire.

3- Dans la fonction d'écoute d'événement, utilisez document.querySelector('input[name="amount"]:checked') pour obtenir le bouton radio sélectionné.

4- Utilisez document.getElementById("montantlibre") pour obtenir les champs de saisie.

5- Utilisez if (!Number(inputField.value) !== true) { ... } pour vérifier si le champ de saisie a une valeur.

6- Si le champ de saisie a une valeur, stockez cette valeur dans la variable montant. Sinon, stockez la valeur du bouton radio sélectionné dans la variable montant.

7- Utilisez event.preventDefault() pour empêcher la soumission du formulaire par défaut.