Sujet Précédent Sujet Suivant

Vérifier plusieurs input

emrh Messages postés 427 Date d'inscription mardi 9 décembre 2014 Statut Membre Dernière intervention 16 janvier 2023 - 23 nov. 2022 à 12:06
Misterlolo57 Messages postés 12 Date d'inscription jeudi 29 décembre 2022 Statut Membre Dernière intervention 30 décembre 2022 - 30 déc. 2022 à 16:59

Bonjour à tous,

Existe t-il un moyen simple et efficace de vérifier que certains input sont bien renseignés pour activer ou non un button ?
J'ai écris une fonction qui n'est pas fiable puisque lorsque j'efface le contenu d'un des input le button reste actif !

(Précision, ce button n'est pas celui qui valide le formulaire)

function activeBtnTs() {
    var vide = 0;
    for (i = 1; i <= dureeSejour; i++) {
        if (document.getElementById('adultes' + i).value == 0) {
            vide = vide + 1;
        }
        if (document.getElementById('exo' + i).value == 0) {
            vide = vide + 1;
        }
    }
    if (vide == 0) {
        var btnTs = document.getElementById("button-ts");
        if (btnTs) {
            btnTs.classList.remove("btn-vert-disabled");
            btnTs.classList.add("btn-vert");
            btnTs.disabled = false;
        }
    }
}

Merci d'avance pour votre aide !
Linux / Chrome 107.0.0.0

A voir également:

2 réponses

Réponse 1 / 2
emrh Messages postés 427 Date d'inscription mardi 9 décembre 2014 Statut Membre Dernière intervention 16 janvier 2023 16
Modifié le 23 nov. 2022 à 16:43

Du mieux avec ça, mais ça me semble très usine à gaz ! 

function activeBtnTs(){
    var vide=0;
    for (i = 1; i <= dureeSejour; i++) {                    
        if(document.getElementById('adultes'+i).value == ''){
            vide = vide + 1;
        }
        if(document.getElementById('exo'+i).value == ''){
            vide = vide + 1;
        }
    }
    if(vide==0){
        var btnTs = document.getElementById("button-ts");
        if(btnTs){
            btnTs.classList.remove("btn-vert-disabled");
            btnTs.classList.add("btn-vert");
            btnTs.disabled = false;
        }
    }
    else {
        desactiveBtnTs();
    }
}

function desactiveBtnTs(){
    var btnTs = document.getElementById("button-ts");
    if(btnTs){
        btnTs.classList.add("btn-vert-disabled");
        btnTs.classList.remove("btn-vert");
        btnTs.disabled = true;
    }
}
0
Réponse 2 / 2
Misterlolo57 Messages postés 12 Date d'inscription jeudi 29 décembre 2022 Statut Membre Dernière intervention 30 décembre 2022 10
Modifié le 30 déc. 2022 à 17:01

tu peux utiliser une boucle for pour parcourir tous les inputs et vérifier si leur valeur est vide ou non. Si tous les inputs ont une valeur non vide, tu peux activer le bouton en modifiant ses propriétés.

Exemple :

function activeBtnTs() {
  // Récupération de tous les inputs
  var inputs = document.querySelectorAll('input[id^="adultes"], input[id^="exo"]');
  var inputsFilled = true;

  // Parcours de tous les inputs
  for (var i = 0; i < inputs.length; i++) {
    if (inputs[i].value === '') {
      // Si un input est vide, la variable inputsFilled prend la valeur false
      inputsFilled = false;
      break;
    }
  }

  // Si tous les inputs sont remplis
  if (inputsFilled) {
    // Récupération du bouton
    var btnTs = document.getElementById("button-ts");
    if (btnTs) {
      // Modification des propriétés du bouton pour l'activer
      btnTs.classList.remove("btn-vert-disabled");
      btnTs.classList.add("btn-vert");
      btnTs.disabled = false;
    }
  }
}
0