Forum |  HardWare.fr | News | Articles | PC | S'identifier | S'inscrire | Shop Recherche
1618 connectés 

  FORUM HardWare.fr
  Programmation
  HTML/CSS

  [Résolu] Javascript qui plante

 


 Mot :   Pseudo :  
 
Bas de page
Auteur Sujet :

[Résolu] Javascript qui plante

n°1057038
bepimaco
Festina lente
Posté le 22-04-2005 à 18:06:11  profilanswer
 

Je n'arrive pas à comprendre ce qui ne marche pas ?
 
C'est un script de vérification de formualaire qui permet de choisir les colonnes à imprimer d'une liste d'adhérents. Les 2 premiers tests se font sans rpoblèmes, mais les autres ne passent pas ?
 

Code :
  1. function valider(){
  2. if(document.imprimerFormulaire.nom.checked == false ){
  3.  alert("Vous ne pouvez supprimer le nom" );
  4.  return false;
  5. }
  6. if(document.imprimerFormulaire.prenom.checked == false ){
  7.  alert("Vous ne pouvez supprimer le prénom" );
  8.  return false;
  9. }
  10. var compteur = 54;
  11. if(document.imprimerFormulaire.unite.checked == true ){
  12.  compteur = compteur + 35;
  13. }
  14. if(document.imprimerFormulaire.numad.checked == true ){
  15.  compteur = compteur + 13;
  16. }
  17. if(document.imprimerFormulaire.naissance.checked == true ){
  18.  compteur = compteur + 27;
  19. }
  20. if(document.imprimerFormulaire.age.checked == true ){
  21.  compteur = compteur + 11;
  22. }
  23. if(document.imprimerFormulaire.adresse.checked == true ){
  24.  compteur = compteur + 101;
  25. }
  26. if(document.imprimerFormulaire.tel1.checked == true ){
  27.  compteur = compteur + 21;
  28. }
  29. if(document.imprimerFormulaire.tel2.checked == true ){
  30.  compteur = compteur + 21;
  31. }
  32. if(document.imprimerFormulaire.email.checked == true ){
  33.  compteur = compteur + 41;
  34. }
  35. var mode = document.imprimerFormulaire.mode.value;
  36. if (mode == "portrait" && compteur > 171) {
  37.  alert ("Vous avez sélectionné trop d'information. Passez en paysage" );
  38.  return false;
  39. }
  40. if (mode == "paysage" && compteur > 258) {
  41.  alert ("Vous avez sélectionné trop d'information." );
  42.  return false;
  43. }


 
Il s'agit de checkbox qui si elles sont cochées permettront l'impression de la colonne correspondante. Le compteur permet de limiter le nombre en fonction de la largeur de la page.
Le mode est un bouton radio qui permet de choisir entre portrait et paysage
 
Pour info, la page PHP qui gère tout ça fonctionne très bien : c'est donc juste le Javascript qui foire
 
Merci


Message édité par bepimaco le 24-04-2005 à 09:28:37

---------------
Bepimaco
mood
Publicité
Posté le 22-04-2005 à 18:06:11  profilanswer
 

n°1057114
bepimaco
Festina lente
Posté le 22-04-2005 à 18:57:26  profilanswer
 

La totalité de la page :
 

Code :
  1. <!-- Insertion du fichier contenant l'entête de la page
  2. Ne pas oublier de remplir les champs titre et description-->
  3. <?php
  4. $titre="Procédure d'impression - [&eacute;tape 1/2]";
  5. $base = "liste";
  6. include '../inclus-entetebdd.php';
  7. ?>
  8. <script language="JavaScript">
  9. <!--
  10. function valider(){
  11. if(document.imprimerFormulaire.nom.checked == false){
  12.  alert("Vous ne pouvez supprimer le nom" );
  13.  return false;
  14. }
  15. if(document.imprimerFormulaire.prenom.checked == false){
  16.  alert("Vous ne pouvez supprimer le prénom" );
  17.  return false;
  18. }
  19. var compteur = 54;
  20. if(document.imprimerFormulaire.unite.checked == true){
  21.  compteur = compteur + 35;
  22. }
  23. if(document.imprimerFormulaire.numad.checked == true){
  24.  compteur = compteur + 13;
  25. }
  26. if(document.imprimerFormulaire.naissance.checked == true){
  27.  compteur = compteur + 27;
  28. }
  29. if(document.imprimerFormulaire.age.checked == true){
  30.  compteur = compteur + 11;
  31. }
  32. if(document.imprimerFormulaire.adresse.checked == true){
  33.  compteur = compteur + 101;
  34. }
  35. if(document.imprimerFormulaire.tel1.checked == true){
  36.  compteur = compteur + 21;
  37. }
  38. if(document.imprimerFormulaire.tel2.checked == true){
  39.  compteur = compteur + 21;
  40. }
  41. if(document.imprimerFormulaire.email.checked == true){
  42.  compteur = compteur + 41;
  43. }
  44. var mode = document.imprimerFormulaire.mode.value;
  45. if (mode=="portrait" && compteur>171) {
  46.  alert ("Vous avez sélectionné trop d'information. Passez en paysage" );
  47.  return false;
  48. }
  49. if (mode=="paysage" && compteur>258) {
  50.  alert ("Vous avez sélectionné trop d'information." );
  51.  return false;
  52. }
  53. if(document.imprimerFormulaire.mode.value == "paysage" ){
  54.  alert("Lors de l'impression, sélectionnez paysage" );
  55.  return false;
  56. }
  57. }
  58. // -->
  59. </script>
  60. <style type="text/css">
  61. h1 {
  62.  text-align: center;
  63.  color: black;
  64.  z-index: 3;
  65.  font-size: 2em;
  66.  margin: 0;
  67.  padding: 0;
  68. }
  69. table {
  70.  text-align: left;
  71.  font-family: arial, helvetica, verdana, sans-serif;
  72.  background-color : transparent;
  73.  margin-top: 10px;
  74.  margin-left: 10px;
  75. }
  76. #ajout1{
  77.  position: absolute;
  78.  margin-top: 150px;
  79.  width: 554px;
  80.  left: 50%;
  81.  margin-left: -277px;
  82. }
  83. #ajout2{
  84.  position: absolute;
  85.  text-align: center;
  86.  background-image: url('../../styles/bdd/images/ecran-chapeau.gif');
  87.  width: 554px;
  88.  height: 43px;
  89. }
  90. #ajout3{
  91.  position: absolute;
  92.  margin-top: 43px;
  93.  background-image: url('../../styles/bdd/images/ecran-titre.gif');
  94.  width: 554px;
  95.  height: 43px;
  96.  color: black;
  97.  z-index: 2;
  98. }
  99. .ajout4{
  100.  position: absolute;
  101.  margin-top: 86px;
  102.  background-image: url('../../styles/bdd/images/ecran-corps.gif');
  103.  width: 554px;
  104.  height: 339px;
  105. }
  106. #ajout5{
  107.  position: absolute;
  108.  background-image: url('../../styles/bdd/images/ecran-action.gif');
  109.  width: 554px;
  110.  height: 43px;
  111.  margin: 0;
  112.  padding: 0;
  113.  z-index: 2;
  114. }
  115. #ajout6{
  116.  position: absolute;
  117.  margin-top: 431px;
  118.  background-image: url('../../styles/bdd/images/ecran-base.gif');
  119.  width: 554px;
  120.  height: 48px;
  121.  z-index: 1;
  122. }
  123. select{
  124.  background: #cccccc;
  125.  border: solid black 1px;
  126. }
  127. textarea{
  128.  background: transparent;
  129.  border: solid black 1px;
  130. }
  131. </style>
  132. </head>
  133. <?php
  134. include '../inclus-ambiancebdd.php';
  135. ?>
  136. <!-- Contenu de la page -->
  137. <div id="ajout1">
  138. <div id="ajout2"></div>
  139. <div id="ajout3">
  140.     <h1>Impression s&eacute;lective</h1>
  141. </div>
  142. <div class="ajout4">
  143. <form action="adherents-imprimer2.php" method="post" name="imprimerFormulaire" onSubmit="return valider()">
  144.  <table>
  145.   <tr>
  146.    <td><input name="nom" type="checkbox" value="nom" checked="checked"></td>
  147.    <td>Nom</td>
  148.   </tr>
  149.   <tr>
  150.    <td><input name="prenom" type="checkbox" value="prenom" checked="checked"></td>
  151.    <td>Pr&eacute;nom</td>
  152.   </tr>
  153.   <tr>
  154.    <td><input name="unite" type="checkbox" value="unite"></td>
  155.    <td>Unit&eacute;</td>
  156.   </tr>
  157.   <tr>
  158.    <td><input name="numad" type="checkbox" value="numad"></td>
  159.    <td>Num&eacute;ro d'adh&eacute;rent</td>
  160.   </tr>
  161.   <tr>
  162.    <td><input name="naissance" type="checkbox" value="naissance"></td>
  163.    <td>Date de naissance</td>
  164.   </tr>
  165.   <tr>
  166.    <td><input name="age" type="checkbox" value="age"></td>
  167.    <td>Age</td>
  168.   </tr>
  169.   <tr>
  170.    <td><input name="adresse" type="checkbox" value="adresse"></td>
  171.    <td>Adresse</td>
  172.   </tr>
  173.   <tr>
  174.    <td><input name="tel1" type="checkbox" value="tel1"></td>
  175.    <td>Num&eacute;ro de t&eacute;l&eacute;phone 1</td>
  176.   </tr>
  177.   <tr>
  178.    <td><input name="tel2" type="checkbox" value="tel2"></td>
  179.    <td>Num&eacute;ro de t&eacute;l&eacute;phone 2</td>
  180.   </tr>
  181.   <tr>
  182.    <td><input name="email" type="checkbox" value="email"></td>
  183.    <td>Adresse e-mail</td>
  184.   </tr>
  185.   <tr>
  186.    <td><input name="mode" type="radio" value="portrait" checked="checked"></td>
  187.    <td>Impression en portrait</td>
  188.   </tr>
  189.   <tr>
  190.    <td><input name="mode" type="radio" value="paysage"></td>
  191.    <td>Impression en paysage</td>
  192.   </tr>
  193.      </table>
  194.  <div id="ajout5">
  195.   <div id="annuler"><a href="../zone-a/adherents-afficher.php"></a></div>
  196.   <div id="valider"><input name="envoyer" type="image" src="../../styles/bdd/images/vide.gif"></div>
  197.  </div>
  198.  </form>
  199. </div>
  200. <div id="ajout6"></div>
  201. <?php
  202. //récupération des valeurs des champs:
  203. $requete = $_GET["query"] ;
  204. echo $requete ;
  205. ?>
  206. </div>
  207. </body>
  208. </html>


Message édité par bepimaco le 22-04-2005 à 18:59:09

---------------
Bepimaco
n°1057560
FlorentG
Unité de Masse
Posté le 23-04-2005 à 11:22:12  profilanswer
 

Déjà les trucs du style :

document.imprimerFormulaire.nom...


Sont à bannir totalement, car ce sont des méthodes d'il y a 20 ans qui ne sont plus valides.
Donc, faisons la mise à jour.
 
1) Le formulaire. On va dire qu'on garde le tableau, vu que t'as l'air d'avoir trié ça sur deux colonne : champs & libellés de part et d'autres. Déjà t'as pas associé les libellé et les contrôle. Exemple :

<tr>
  <td><input id="naissance" name="naissance" type="checkbox" value="naissance"></td>
  <td><label for="naissance">Date de naissance</label></td>
</tr>


Donc note l'ajout de l'attribut id dans le input, et l'élément <label>, qui a un attribut for qui contient l'id du contrôle associé.
 
2) Le JS. Maintenant que tous tes contrôles ont un id, tu peux faire :

if(document.getElementById('naissance').checked == false){
  alert("Vous ne pouvez supprimer le nom" );
  return false;
}


Et là ça commence à p00trer.
 
Aussi, on ne met jamais de :

<script language="JavaScript">


Mais :

<script type="text/javascript">


Mais le mieux pour ce genre d'erreurs et de balancer ta page au validateur du w3
 
Sinon, pour ton erreur, y'aurait pas un problème avec les deux premier test qui renvoient [i]false[i] en cas d'erreur, et qui feraient sortir de la fonction, sans passer aux autres tests ?

n°1058439
bepimaco
Festina lente
Posté le 24-04-2005 à 09:28:17  profilanswer
 

Merci de ton aide. J'ai troqué les name contre des id, j'ai ajouté les labels. Et pour ce qui est du javascript, je sais pas pourquoi j'ai mis celui-là : une bête erreur de copié collé.
 
Encore merci, tout fonctionne à merveille


---------------
Bepimaco
n°1058453
cerel
Posté le 24-04-2005 à 10:28:34  profilanswer
 

Faut pas enlever les "name". Les name doivent etre uniquement utilise a l'interieur d'un formulaire, et pas ailleurs.
 
Donc tu remets les name, mais tu laisse les id.

n°1058455
bepimaco
Festina lente
Posté le 24-04-2005 à 10:41:34  profilanswer
 

En fait, j'ai mis name + id merci de l'info


---------------
Bepimaco

Aller à :
Ajouter une réponse
  FORUM HardWare.fr
  Programmation
  HTML/CSS

  [Résolu] Javascript qui plante

 

Sujets relatifs
[RESOLU] compiler sources c et c++ avec autoconf/automake[Résolu] Insérer dans un champ texte en fonction de checkbox
[résolu] Signature forum hardware.fr -> cURL[javascript] pb expression régulière
[C] Valeur reçue différente de la valeur retournée [Résolu]qui peut dire ce qui cloche dans mon mini prog ?? [ RESOLU ]
le javascript classicArrondir un filesize [RESOLU]
[Java] [Resolu] Erreur ODBC État de curseur non valideProblème Javascript InnerHTML avec firefox
Plus de sujets relatifs à : [Résolu] Javascript qui plante


Copyright © 1997-2022 Hardware.fr SARL (Signaler un contenu illicite / Données personnelles) / Groupe LDLC / Shop HFR