Tester les champs et activer le bouton submit si ok

Eléphant du PHP | 428 Messages

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

devlop78
Invité n'ayant pas de compte PHPfrance

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();" ... />
...

devlop78
Invité n'ayant pas de compte PHPfrance

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>

Mammouth du PHP | 661 Messages

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 ^^ ...

Eléphant du PHP | 428 Messages

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()"

devlop78
Invité n'ayant pas de compte PHPfrance

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 ;) ).

devlop78
Invité n'ayant pas de compte PHPfrance

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()"

Eléphant du PHP | 428 Messages

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

devlop78
Invité n'ayant pas de compte PHPfrance

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.