Rendre un bouton cliquable seulement quand le champ autocomplete est rempli

**reader27** · 29/02/2020, 00h34

Bonjour

Je voudrai rendre un bouton cliquable seulement quand un champ autocomplete et rempli correctement , je ne trouve pas comment faire , si vous aviez une piste pour m aiguiller pour trouver svp .

Merci d'avance .

**ProgElecT** · 29/02/2020, 09h06

Salut

et rempli correctement

Cela manque de précision,
⇨ au moins X nombre de caractères ?
⇨ que des chiffres ?
⇨ certains caractères mais pas d'autres ?
⇨ doit suivre un certain modèle ?
⇨ une combinaison des possibilités déjà indiquée ...... ?

**reader27** · 29/02/2020, 11h16

Bonjour

Oui désoler

Alors je ne peut pas dire pour le nombre de caractères , car c 'est sélection depuis une bdd qui affiche , la ville , région , et pays .
Donc en faite le membre commencera a afficher les lettre de sa ville .Une proposition lui sera proposer parmi plusieurs villes .
Jusqu’à la tout va bien , La ou je bloque de faire un bouton qui sois cliquable seulement si la personne valide son choix selon le choix qui lui sois proposer .
Je ne sais pas si je suis assez clair dans ma demande , mais j ai ajouter un un fichier pour monter se que j ai fais pour le moment , je voudrais ajouter se bouton rendu cliquable seulement si le membre choisi une réponse parmi les propositions

**ProgElecT** · 29/02/2020, 11h33

Ok

Il faut rendre ton bouton disabled = false ou disabled = true.
exemple:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
<script>
	const btn = document.getElementById("Btn1");
	Btn1.disabled = true;
 
function analyse(){
	if (choixpasbon){
		Btn1.disabled = true;
		return;
	}
	Btn1.disabled = false;
	// la suite si le choix est cohérent
}
</script>

**reader27** · 29/02/2020, 11h43

d accord merci pour la réponse rapide je vais voir avec disabled , je revient mettre en résolu une fois que j ai réussi

**ProgElecT** · 29/02/2020, 13h21

Pour le fun

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
<!DOCTYPE html>
<html lang="fr">
	<head>
		<meta http-equiv="content-type" content="text/html"; charset="utf-8"/>
	</head> 
	<body>
		Votre choix pour un navigateur internet:
		<br />
		<input list="navigateurs"  id="lstnav" oninput="verif()"/>
		<datalist id="navigateurs">
			<option value="Chrome">
			<option value="Firefox">
			<option value="Internet Explorer">
			<option value="Opera">
			<option value="Safari">
		</datalist>
		<button id="Btn2">Valider</button>
 
		<script>
                        const btn2 = document.getElementById("Btn2");
                        btn2.disabled = true;
                        function verif(){
                                let txt = document.getElementById("lstnav").value;
                                let cntdatas = document.getElementById("navigateurs");
                                btn2.disabled = true;
                                for (let i = 0, iMax  = cntdatas.options.length; i < iMax; i++) {
                                        if (cntdatas.options[i].value === txt){
                                                btn2.disabled = false;
                                                break;
                                        }
                                }
                        }
                </script>
	</body>
</html>

Il y a peut être mieux .... , mais cela a le mérite de fonctionner.

Rendre un bouton cliquable seulement quand le champ autocomplete est rempli

JavaScript

Vue hybride

Discussions similaires

Partager

Partager