Discussion :

[Thébé]

Bonjour à tous,

Je commence en développement web sur un projet (refonte en java) et j'aurais besoin de réponse à quelques question pour savoir ce qui fait quoi dans un formulaire.

J'ai une page JSP avec un formulaire à remplir. J'ai un JS qui sert pour la validation des différents champs du formulaire et un servlet pour rediriger si le tout est valide.

Code :

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
 
<form id="Administration" action="<%=appRoot%>/Directive" method="post" onsubmit="">
                            <input type="hidden" value="Administration" id="Directive" name="Directive"/>
                            <br />
                             Nom : <input class="inputText" type="text" name="nom_US" id="nom_US" value="<%=((ClUsager) usager.get(0)).getNom()%>">
                                <br /><br /><br />
                             Prénom : <input class="inputText" type="text" name="prenom_US" id="prenom_US" value="<%=((ClUsager) usager.get(0)).getPrenom()%>"/>
                                <br /><br /><br />
                             Courriel : <input class="inputText" type="text" name="courriel_US" id="courriel_US" value="<%=((ClUsager) usager.get(0)).getCourriel()%>"/>
                                <br /><br /><br />
                             Mot de passe : <input class="inputText" type="text" name="pw_US" id="pw_US" value="<%=((ClUsager) usager.get(0)).getpassword()%>"/>
                                <br /><br /><br />
                             Droits :
                                <br /><br />
                            <input type="radio" id="choix" name="choix" value=2>Administateur
                            <input type="radio" id="choix" name="choix"  value=1>Redacteur
                            <input type="radio"id="choix" name="choix" value=0>Lecteur
                            <input type="hidden" value="<%=((ClUsager)usager.get(0)).getId()%>" id="numero" name="numero"/>
                            <input type="hidden" value="numeroUsager" id="numeroUsager" name="numeroUsager"/>
                            <p class="centrer">
                                <input id="boutonValider" type="submit" value="Valider" style="background-color: #FFFFFF; width:100px; height:30px"
                                       onclick="return validerFormulaireAdministration(this);
                                           window.location='<%=appRoot%>/AccesUsager?numéro='+document.getElementById(numeroUsager).value+'&cible=1'"/>
                            </p>
                        </form>

Ce que je voulais savoir c'est :
- Où et comment dois-je appeler la fonction de mon JS validerFormulaireAdministration(this)? Le onsubmit de la form ou le onclick du bouton valider?
- Où et comment dois-je appeler mon servlet (method post; Servlet au nom de "Directive")?

Merci d'avance
Le code est peut-être laid mais "Ce n'est pas mon code"

[OButterlin]

Pour ce qui est de la première question, je dirais onsubmit (tu peux envoyer le formulaire sans cliquer sur le bouton, juste en tapant Enter dans un des champ).

Pour la deuxième question, je n'ai pas compris où est ton problème...

Peux-tu préciser ?

[Thébé]

J'appelle un servlet du nom de Directive qui sert à traiter l'information du formulaire puis qui redirige le navigateur vers une autre page JSP.

Dans Directive il n'y a qu'une fonction qui fait un énorme switch case avec le nom du formulaire qui l'appelle avec une méthode de type post, fait les traitements et fait afficher une nouvelle page.

Je voulais savoir comment écrire tout cela dans mon formulaire.
Ce que j'ai pour le moment ressemble à ceci (inspiré d'un autre formulaire du projet)

Code :

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

1
2
3
 
<form id="Administration" action="<%=appRoot%>/Directive" method="post" onsubmit="">
    <input type="hidden" value="Administration" id="Directive" name="Directive"/>

Il me manque le comment appeler le dit fichier Directive en lui envoyant(document.getElementById(Directive).value)

Je cherche donc la syntaxe
_____________
Edit: Ajout d'info : Mon javascript n'est pas appelé

Code :

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

1
2
3
4
<script type="text/javascript" src="<%=appRoot%>/js/Validation.js"></script>
.......
<form id="Administration" action="<%=appRoot%>/Directive" method="post" onsubmit="return validerFormulaireAdministration(this)">

En rouge : l'ajout fait par rapport à la réponse ci-haut.
En vert foncé : Appel au servlet Directive (Dois-je le mettre là?)

________
Suite du édit : J'arrive à envoyer le tout au servlet

Code :

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

1
2
<input id="boutonValider" type="submit" value="Valider" style="background-color: #FFFFFF; width:100px; height:30px"
                                       onclick="window.location='<%=appRoot%>/Directive?para=Administration'"/>

Le code de mon bouton Valider; j'ai teste avec la touche Entrer dans un champs le servlet est aussi appelé.

Le problème est maintenant que mon JS n'est pas appellé

[OButterlin]

Attention, avec Firefox ça fonctionne mais pas avec IE (en tout cas pas IE6).
Je te conseille onsubmit qui fonctionne avec les 2 (et normalement avec tous).

Si ta fonction js n'est pas appelée, il y a peut-être un problème avec elle.
Si tu utilises Firefox, regarde à tout hasard si la console d'erreur n'indique rien.
Sinon, peux-tu montrer le code de la fonction ?

[Thébé]

Bon voilà le problème : Chrome ne supporte pas le javascript
Avec firefox le javascript fonctionne mais il me redirige même si le tout n'est pas valide. Sans doute une erreur de return dans mon js.

Pour ce qui est du onsubmit, c'est celui du bouton valider que tu parles?
Changer onclick pour onsubmit?

Merci

[OButterlin]

Non, c'est onsubmit de la balise <form>.
Juste avant que le formulaire ne soit envoyé, cette évènement est déclanché.
En fonction de la valeur de retour de la méthode, on envoie ou non.
Si la méthode renvoie "false" -> pas d'envoi

[Thébé]

Tout est réglé de mon côté pour le problème. Merci OButterlin

Pour résumer les solutions si jamais quelqu'un de débutant (comme moi en java et cie.) tombe sur le même problème :
- Le javascript est appelé dans le onsubmit de la forme <form>

Code :

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

<form id="Administration" action="<%=appRoot%>/Directive" method="post" onsubmit="return validerFormulaireAdministration(this)">

- La redirection (Directive) est appelée avec le onclick du bouton de validation qui fonctionne en cliquant et avec la touche Entrer dans un champs

Code :

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

<input id="boutonValider" type="submit" value="Valider" style="background-color: #FFFFFF; width:100px; height:30px" onclick="window.location='<%=appRoot%>/Directive?para='+getAttribute(Directive).value+''"/>

- GoogleChrome ne supporte pas le javascript

[jowo]

- GoogleChrome ne supporte pas le javascript

Ton GoogleChrome peut être pas mais le mien le supporte très bien et heureusement pour lui