Tester les champs et activer le bouton submit si ok

Répondre


Cette question est un moyen d’empêcher des soumissions automatisées de formulaires par des robots.
Smileys
:D :) :( :o :shock: :? 8-) :lol: :x :P :oops: :cry: :evil: :twisted: :roll: :wink: :!: :?: :idea: :arrow: :| :mrgreen: =D> #-o =P~ :^o :non: :priere: 8-|
Voir plus de smileys
  Revue du sujet
 

  Étendre la vue Revue du sujet : Tester les champs et activer le bouton submit si ok

Re: Tester les champs et activer le bouton submit si ok

par devlop78 » 10 avr. 2010, 14:42

Oui donc si par défaut il est disable cela veut dire que ton formulaire n'est pas accessible aux personnes ayant désactivé javascript. Alors que quand j'avais fait document.onload = machin.disabled = 'true' (c'est l'idée), cela ne s'exécute que si javascript est activé.

Donc moi je créerai mon formulaire normalement en XHTML + CSS pour tout le monde puis j'implémenterai ce qu'il faut en Javascript, ce qui veut dire autant l'activation que la désactivation du bouton.

Re: Tester les champs et activer le bouton submit si ok

par visualight » 10 avr. 2010, 11:15

Oui, ... j'ai pas fait attention pour l'appel de la fonction ... désolé c'est bien ScanEmpty();

Il est impossible pour l'utilisateur de cliquer sur le bouton submit car par défaut il est "disable".
Quand on remplis les champs du formulaire, il y a appel de la fonction qui vérifie si les champs X, Y et Z sont remplis (non vide).
Si il ne sont pas vide, la fonction active alors le bouton submit.

Je l'ai testé un peu dans tous les sens et ça fonctionne bien.
Je retiens néanmois ton code si je rencontre un problème ...

Merci à vous ;)
raph

Re: Tester les champs et activer le bouton submit si ok

par devlop78 » 10 avr. 2010, 02:13

Je suis content que ton travail te plaise mais d'un l'appel à la fonction risque d'échouer (ce n'est pas la même), et de deux, là si le mec clique sur le submit, ça fonctionnera puisque ton javascript ne se lance que lorsque il COMMENCE le questionnaire. Je trouve que les idées que j'ai données étaient meilleures, on peut sûrement faire mieux mais là ... et puis document.forms[0] peut être vicieux si tu rajoutes par la suite un formulaire (par exemple un formulaire de recherche à coté de ton logo ...).
J'ai fait ceci (purée ça m'a pris 3h ...: faut que je m'y mette plus à javascript)

[javascript]
<script type="text/javascript">
function ScanEmpty(){
var MonForm=document.forms[0];
var empty=false;

switch(true){
case (MonForm.elements['page_type'].value.length==0) : empty=true;
break;
case (MonForm.elements['page_date'].value.length==0) : empty=true;
break;
case (MonForm.elements['page_title'].value.length==0) : empty=true;
break;
}

MonForm.elements['envoyer'].disabled=empty;
}
</script>
[/javascript]

Avec un check dans les inputs et selects:

Code : Tout sélectionner

onchange="ScanForEmpty()"

Re: Tester les champs et activer le bouton submit si ok

par devlop78 » 10 avr. 2010, 02:08

C'est pas du CSS disabled si ? C'est un peu comme readonly pour textarea. Ca m'a l'air surtout pas la même chose. Moi je cache alors que disabled (d'après google ...) a l'air de rendre non enabled (je fais référence à VB ;) ).

Re: Tester les champs et activer le bouton submit si ok

par visualight » 09 avr. 2010, 22:42

J'ai fait ceci (purée ça m'a pris 3h ...: faut que je m'y mette plus à javascript)

[javascript]
<script type="text/javascript">
function ScanEmpty(){
var MonForm=document.forms[0];
var empty=false;

switch(true){
case (MonForm.elements['page_type'].value.length==0) : empty=true;
break;
case (MonForm.elements['page_date'].value.length==0) : empty=true;
break;
case (MonForm.elements['page_title'].value.length==0) : empty=true;
break;
}

MonForm.elements['envoyer'].disabled=empty;
}
</script>
[/javascript]

Avec un check dans les inputs et selects:

Code : Tout sélectionner

onchange="ScanForEmpty()"

Re: Tester les champs et activer le bouton submit si ok

par Nours312 » 09 avr. 2010, 21:57

perso, j'utilises plus l'attribut disable plutot que le display:none !.. c'est moins ennuyeux avec certains navigateur (textuels) et vu que c'est son job ^^ ...

Re: Tester les champs et activer le bouton submit si ok

par devlop78 » 09 avr. 2010, 21:24

ou

<script ...>

document.onload = function() {
document.getElementById('machin').style.display = "none";
}

function check() {

// Tu verifies tous tes champs et si c'est ok tu mets document.getElementById('machin').style.display = "block";
}

</script>

<form ...>

<input type="text" id="nom" ... onchange="check();" />

<div id="machin"><input type="submit" ... /></div>

Re: Tester les champs et activer le bouton submit si ok

par devlop78 » 09 avr. 2010, 21:21

Je ne suis pas sûr mais un truc du genre
<script type="text/javascript">
function check() {

//ici tu testes tes champs

if (document.forms['tocheck'].nom.value == '') {
alert('Bah alors ! T\'as pas de nom ?');
return false;
}
return true;
// Si c'est bon tu écris return true;
// Si c'est pas bon tu écris return false;

}
</script>

...
<form name="tocheck" ... />
<input type="submit" onclick="return check();" ... />
...

Tester les champs et activer le bouton submit si ok

par visualight » 09 avr. 2010, 19:48

Bonjour,

Toujours aussi nul en javascript, je recherche la manière (ou un script) me permettant de tester quelques champs d'un formulaire et activer le bouton submit si ils sont remplis.

Pouvez-vous m'aider ou du moins m'aiguiller avec des exemples ?

Mes champs sont : page_type, date, page_title, page_title_int, page_place

Merci,
raph