[Résolu] Validation Javascript qui ne fonctionne pas

Bonjour,

Je voudrais vérifier la validité d'un formulaire en javascript avant de l'envoyer vers le serveur et une vérif PHP. Pour ça, j'ai une balise form du type :

<form method="post" action="evaluation-envoi.php" onsubmit="return valider();">

Si cette question n'est pas dans la rubrique javascript, c'est que le problème ne vient pas du Javascript mais de l'XHTML puisque quelle que soit la fonction Javascript (même la plus simple), elle n'est jamais appelée.

Quelques précisions concernant le formulaire :
- il est en XHTML 1.0 strict (valide)
- il est généré par un script PHP
- l'intégralité du code est dispo http://www.bepimaco.info/exemple.rien

Merci de votre aide
Modifié par Bepimaco (27 Oct 2005 - 22:42)

Bonjour,
franchement, je ne vois pas pourquoi un onsubmit ne fonctionnerait pas.

A tout hasard, as-tu essayé onsubmit="alert('bip bip');" et est-ce que dans ce cas ça marche ?

Je viens d'essayer, rien ne se passe !

Je ne vois vraiment pas d'où ça vient.

J'ai essayé avec plusieurs navigateurs (IE, Firefox, Opera) et toujours le même résultat. Sachant que de toutes façons, JavaScript est activé de partout !

Bepimaco, peux-tu nous montrer la page en ligne ? Je ne parle pas du code php car de toutes façons, ca n'a rien à voir au problème. Je parle d'une page html fonctionnelle où ton code a été généré.

Merci

Un lien vers la page :

http://www.scouts-stegreve.com/public/divers-evaluations-voir.php?identification=9

Tu as fais une erreur lors de ton test.

Il fallait écrire "alert" et non "alerte".

Dans Firefox, as-tu installé la bar de Web Developer ? Cela te permet de visualiser s'il y a des erreurs Javascript.

Dans ton cas, onsubmit se déclenche bel et bien mais tu as des erreurs dans ton code javascript, ce qui donne l'impression que rien ne se passe.

Même si c'est hors-sujet, ton code est bourré de div. Il existe d'autres balises que des divs. Tu semble souffrir de divite aigue. Je vais tenter de te trouver un article sur la sémantique web.

Par exemple, dans ton code, tu pourrais utiliser des fieldsets pour regrouper tes champs, et des labels pour le libellé de chaque champ. Ce serait déjà une bonne amélioration.
Modifié par Merkel (27 Oct 2005 - 19:44)

Salut !

Je profite de ce sujet pour faire une remarque qui a peut-être déjà été faite ailleurs, et qui vous paraîtra sûrement un peu bête... Mais j'ai quand même mis du temps à comprendre : en fait j'étais en train de modifier le site que je suis en train de réaliser pour qu'il soit valide XHTML Strict, et il me faisait une erreur sur le "onClick" lors de la validation W3C, en me déclarant qu'il n'existait pas d'attribut comme celui-ci...

Après un moment, j'ai fini par comprendre qu'il ne fallait pas mettre de majuscules (ce qui est tout à fait logique pour du XHTML Strict, cf les lois...). Mais bon j'ai quand même miss du temps à réaliser

Alors si jamais cette remarque peut-être utile à quelqu'un

Bonne soirée

Ça a un peu rien à voir mais bon... moi aussi j'ai mis du temps pour me vacciner contre le C majuscule dans onclick.

Bonsoir et merci pour vos réponses. J'ai installé la web developper bar qui m'a pas mal aidé à trouver l'erreur ... toute bête.

Dans la boucle for du javascript, l'itération était initialisée à 0 alors qu'elle devait l'être à 1 ! C'est tout.

Merci encore, et je vais essayer de voir cette histoire de fieldset et label ...

Bonsoir,

Voici deux tutoriaux qui peuvent t'intéresser :

- Utilisation des formulaires

- Bien valider ses formulaires avec Javascript

Évidemment, tu peux styler les fieldsets et labels pour donner quelque chose de mieux que leurs exemples.

D'ailleurs, tu pourrais même en profiter pour lire tout ce qui se trouve sur openweb. C'est très instructif.

Au plaisir !
Modifié par Merkel (27 Oct 2005 - 22:53)

Je me permet de poster dans le même thread, bien que résolu, ayant un problème quasi similaire.

Le validateur refuse de me valider ma page à cause d'un attribut "onClick". Ceci pourrait paraître bête, mais le validateur a bien évidemment raison.

Regardez le code:

<p class="txt_contenu"><strong class="dates">Prix:</strong>
<input type="text" name="resultat" size="4"/>E
<input type="button" value="Calculer le prix"
onClick="document.commande.resultat.value = document.commande.quantity.value / 0.1"/>
</p>

Je vois que ce code ne peut être correct, cependant je ne vois pas de solution...

Sur la même page, un autre petit problème:

<form method="post" action="index.php?page=recapitulatif" name="commande">

L'attribut name n'a pas l'air de plaire au validateur du W3C. Quelqu'un peut m'expliquer pourquoi, et surtout, qu'elle est l'alternative car j'ai besoin d'un attribut de nom ( name, id... ) pour mon calcul de prix


>>>

a écrit :
<input type="button" value="Calculer le prix"
onClick="document.commande.resultat.value = document.[B]commande[/B].quantity.value / 0.1"/>

Merci d'avance.

essaie peut-être onclick sans majuscules

En effet cela fonctionne. Merci bien.


Cependant ma page n'est toujours pas valide à cause de cet attribut name :x

Utilise id à la place de name, si tu accèdes aux éléments de formulaire par document.form['nom_form'], ça ne devrait normalement rien changer.

Mais normalement si tu conçois bien ta fonction de validation, il n'y a même pas besoin de name ou de id. Par exemple, on peut contourner le problème en passant le formulaire comme paramètre de la fonction :

XHTML :
<form ... onsubmit="return valider(this);">

JavaScript :
function valider (f) {
if (!f.elements['champ1'].value) { 
alert("Remplissez le champ1");
f.elements['champ1'].focus();
return false;
}

//......

return true;
}
}

Modifié par QuentinC (01 Nov 2005 - 16:27)