Discussion :

[Hotei]

Bonjour à toute la communauté dev,

N'ayant pas trouvé de cas similaires, je vous expose donc ici mon problème que je n'arrive pas à résoudre car mon code semble bon...

Je suis en train de faire un formulaire d'inscription qui aura des étapes évidement avec des fonctions (pour le moment pas complètement terminées) qui "bloquent" l'accès a la suite du formulaire si on n'a pas rempli les champs obligatoires.

Sur IE le déroulement se fait sans soucis, (la vérification n'a été faite que pour la première partie) mais après tests sous Firefox (3.6) et Chrome (4.0), le formulaire s'affiche dans sa totalité sans tenir compte du javascript qui normalement devrait cacher les différentes étapes a suivre.

Je ne vous écris pas le code ici il serait beaucoup trop long (2000 lignes environ)

je vous pose ici le lien vers lequel vous pourrez télécharger le fichier rar qui comporte le formulaire et le code js : lien retiré

merci d'avance pour vos réponses si vous en avez car moi je plante la ^_^

P.S : fichier joint certifié sans virus ni autre chose du genre.

[E.Bzz]

Bonjour,

Je ne vous écris pas le code ici il serait beaucoiup trop long (2000 lignes environ)

il serait préférable d'en extraire la partie concernée et d'en faire un copié/collé ici

A+

[Hotei]

Ok. merci de ta réponse rapide. je vais essayer de synthétiser le code pour montrer les points que je pense "défaillants" quand à l'affichage qui ne se fait pas correctement.

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
26
27
28
29
30
31
32
33
 function etapeInscription(etape)
   {
      switch(etape)
	  {
case "infoperso" : //infos personnelles [...]
/* CONTROLE FINAL */
if (champ >= 10 )//verif pas bonne 
{  
  //deroule le suivant
 document.getElementById('span_connuFL').style.display 	= "block";	
}
else
{
 document.getElementById('span_connuFL').style.display 	= "none";
}
//enroule le precedent
document.getElementById('span_infoperso').style.display = "none";
 
break;
case "connufl" : //connu francelangue
 
document.getElementById('span_connuFL1').style.display="none";
document.getElementById('span_choixVille').style.display="block";
break;
 
case "choixVille" : //choix de la  ville 
 
ville =document.getElementById('ville').value;
alert("ville"+ville);
document.getElementById('span_villee').style.display="none";
document.getElementById('span_niveauFrancais').style.display="block";
document.getElementById('villecache').value=ville;
break;

Voila. après ca se répète on va dire pour cacher au départ les étapes suivantes et les activer une fois les parties susjacentes dûments remplies.

dans le code html, ca se passe en <span> evidement

Code HTML :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
 <span id="span_infoperso" style="display:block">
	<tr align="center">
	    <td colspan="6"><input type="button" onClick="etapeInscription('infoperso')" value="Etape 2"/></td>
	</tr>
</span>
[...]
<span id="span_connuFL" style="display:none">
[...]
</span>
<span id="span_choixVille" style="display:none">
[...]
</span>
etc

en espérant que ce sont les bonnes parties a observer pour la bizarrerie de mon probleme.

merci d'avance.

[SpaceFrog]

est ce que le etc peut nous laisser penser qu'il y a plusieurs fois le même id sur la page ?

[Bovino]

Comment dire... tu mets réellement les tr dans des span

Rectifie la structure HTML de ta table et il devrait y avoir moins de problèmes d'affichage.

[SpaceFrog]

rhooo p... j'ai pas vu ça

[Hotei]

heu... comment faire pour ne pas mettre les parties du tableau qu'on veut cacher pas dans les span?
je ne vois pas vraiment comment faire autrement au niveau du html.
Peut être pourriez vous me montrer un exemple bref?

mettre un tableau dans chaque span et pas "diviser" les tableaux? ou diviser en div?

Désolé, j'avais quasiment tout le temps fait comme ca et ca passait donc je ne me suis jamais vraiment posé la question.

merci en tous cas pour les réponses.

[edit]ok, j'ai modifié en effet le html en mettant des <table> et </table> pour séparer tout ca et ca a l'air de marcher mieux
Grand merci a vous. mais si vous aviez des solutions plus "correctes" niveau codage de page, je ne suis pas contre [/edit]

[E.Bzz]

En général, on se contente d'afficher/masquer les lignes (<tr>).
Ça marche très bien aussi

Et surtout ça permet de conserver une structure de la page valide

A+

[E.Bzz]

j'avais quasiment tout le temps fait comme ca et ca passait

Ce n'est parce qu'un code fonctionne qu'il ne contient pas d'erreur

Pas de moi, mais particulièrement adapté

A+

[Hotei]

Bon, merci à tous comme édité plus haut, j'ai bien séparé les différents tableaux pour ne pas trop les confondre avec les span etc et ca marche bien.

En effet, je savais très bien que tout ce qui marche n'est pas forcement sans erreur ^_^ mais je ne m'étais jamais posé la question.

Je vais poser un résolu a coté de mon titre de sujet.

Par contre, si vous avez des astuces plus correctes de codage propre, je suis tout ouïe.

Merci encore pour vos réponses rapides.
au revoir et longue vie

[SpaceFrog]

plus correctes ???
mettre un id sur un tr et le masquer est tout ce qu'il y a de plus correct !!
Je ne vois pas ce qui ne te plait pas dasn cette façon de faire ...

[Hotei]

nan, je ne parlais évidement pas de vos remarques plus haut. mais me donner des astuces... comme ne pas mettre les tr dans les span etc.

je parlais "plus correctes" en rapport à mon code qui est du plutôt fait à l'arrache.
Comme je ne suis pas un expert la dedans, je voulais avoir des idées et aperçus plus élaborés.

désolé de m'être mal exprimé. bonne journée.

[SpaceFrog]

ha ... ok desolé ...
ben là du coup ça relève du respect des rgèles concernant la structure du code html.
passe tes codes au validateur html w3c (addon ffx par exemple ou validateur en ligne)

[E.Bzz]

+1

Le validator

Déjà, pour coller aux recommandations actuelles, tu peux virer ta <table>.
Il n'est plus recommandé de les utiliser pour la mise en page, mais uniquement pour afficher ... des tableaux (de données)
Utilise des <div> + CSS à la place.

A+

[Hotei]

grand merci a vous pour ce validator :p

je vais beaucoup m'en servir je pense pour refaire tous mes sites

en espérant que mon "cas" serve d'exemple a ne pas suivre pour les futures questions.

bonne soirée.

P.S : tout marche à présent.