> Tous les forums > Forum des Webmasters
 Addition de champs dans un formulaire
Ajouter un message à la discussion
Page : [1] 
Page 1 sur 1
Francyne
  Posté le 31/12/2005 @ 16:23 
Aller en bas de la page 
Petite astucienne
Bonjour, J'ai créé un site Internet dans lequel j'ai fait un formulaire. Je suis à la recherche d'un bloc de code soit en Javascript ou autre qui me permettrait d'additionner 6 champs monétaires et que dès qu'un montant est inscrit dans l'une des cases, ce montant s'afficherait dans la case total. Si le visiteur enlève un montant, la correction de ferait automatiquement dans la case total. Suis-je trop exigeante?[smile] Je joins l'adresse du site pour avoir une meilleure idée de ce que je demande. www.cybernaute.com/francyne.deschenes/BouclesBows/boucles1-2Fr.htm Merci et à bientôt, Francyne
Publicité
NoNoZeBeSt
 Posté le 31/12/2005 à 16:54 
Aller en bas de la page Revenir au message précédent Revenir en haut de la page
Petit astucien
Salut Francyne, Tu remplaces ton formulaire par (les modifications que j'ai apportées sont en rouge)
<form action="mailto:fd@cybernaute.com?subject=Commande de boucles" method=post ENCTYPE="text/plain" name="formulaire"> <CENTER> <TABLE border=3 width="100%" bgcolor=#E4E7F4> <TBODY> <TR> <TD><FONT face="Times New Roman, Times, serif" color=#000000 size=+0>Boucles 1/2" - 1,30cm:</FONT></TD> <TD><INPUT type="hidden" maxLength=40 name=FRANÇAIS: Boucles 1/2po Quantité: size="10" value=" "></TD> </TR> <TR> <TD><FONT face="Times New Roman, Times, serif" color=#000000 size=+0>Numéro de la boucle:</FONT></TD> <TD> <INPUT type="text" maxLength=40 name=Numero01 size="5" value=" "> <INPUT type="text" maxLength=40 name=Numero02 size="5" value=" "> <INPUT type="text" maxLength=40 name=Numero03 size="5" value=" "> <INPUT type="text" maxLength=40 name=Numero04 size="5" value=" "> <INPUT type="text" maxLength=40 name=Numero05 size="5" value=" "> <INPUT type="text" maxLength=40 name=Numero06 size="5" value=" "> </TD> </TR> <TR> <TD><FONT face="Times New Roman, Times, serif" color=#000000 size=+0>Prix/l'unité: <font size=2>(Ne pas taper les zéros)</FONT></TD> <TD> <INPUT type="text" maxLength=40 name=Prix01 size="5" onBlur="parseelement(this)" value=" " onChange="addition()"> <INPUT type="text" maxLength=40 name=Prix02 size="5" onBlur="parseelement(this)" value=" " onChange="addition()"> <INPUT type="text" maxLength=40 name=Prix03 size="5" onBlur="parseelement(this)" value=" " onChange="addition()"> <INPUT type="text" maxLength=40 name=Prix04 size="5" onBlur="parseelement(this)" value=" " onChange="addition()"> <INPUT type="text" maxLength=40 name=Prix05 size="5" onBlur="parseelement(this)" value=" " onChange="addition()"> <INPUT type="text" maxLength=40 name=Prix06 size="5" onBlur="parseelement(this)" value=" " onChange="addition()"> </TD> </TR> <TR> <TD><FONT face="Times New Roman, Times, serif" color=#000000 size=+0>Total: <font size=2>(Taper le montant sans les zéros)</font></FONT></TD> <TD><INPUT type="text" maxLength=40 name=Total size="10" onBlur="parseelement(this)" value=" "></TD> </TR> <TR> <TD> </TD> <TD> </TD> </TR> <TR> <TD colspan=2 align=center><FONT face="Times New Roman, Times, serif" color=#000000 size=4><B>Pour faire suivre votre commande,<br>vous devez remplir toutes les cases suivantes</B></TD> </TR> <TR> <TD><FONT face="Times New Roman, Times, serif" color=#000000 size=+0>Votre nom:</FONT></TD> <TD><INPUT type="text" maxLength=40 name=Votre-nom size="50" value=" "></TD> </TR> <TR> <TD><FONT face="Times New Roman, Times, serif" color=#000000 size=+0>Votre prénom:</FONT></TD> <TD><INPUT type="text" maxLength=40 name=Votre-prénom size="50" value=" "></TD> </TR> <TR> <TD><FONT face="Times New Roman, Times, serif" color=#000000 size=+0>Votre adresse:</FONT></TD> <TD><INPUT type="text" maxLength=40 name=Votre-adresse size="50" value=" "></TD> </TR> <TR> <TD><FONT face="Times New Roman, Times, serif" color=#000000 size=+0>Ville:</FONT></TD> <TD><INPUT type="text" maxLength=40 name=Ville size="50" value=" "></TD> </TR> <TR> <TD><FONT face="Times New Roman, Times, serif" color=#000000 size=+0>Province:</FONT></TD> <TD><INPUT type="text" maxLength=40 name=Province size="50" value=" "></TD> </TR> <TR> <TD><FONT face="Times New Roman, Times, serif" color=#000000 size=+0>Pays:</FONT></TD> <TD><INPUT type="text" maxLength=40 name=Pays size="50" value=" "></TD> </TR> <TR> <TD><FONT face="Times New Roman, Times, serif" color=#000000 size=+0>Code Postal:</FONT></TD> <TD><INPUT type="text" maxLength=40 name=Code-postal size="50" value=" "></TD> </TR> <TR> <TD><FONT face="Times New Roman, Times, serif" color=#000000 size=+0>Votre adresse email:</FONT></TD> <TD><INPUT type="text" maxLength=100 name=EMAIL size="50" value=" "></TD> </TR> <TR> <TD><FONT face="Times New Roman, Times, serif" color=#000000 size=+0>Instructions supplémentaires,<br>questions ou commentaires:</FONT></TD> <TD><TEXTAREA cols=40 name=Commentaires rows=6></TEXTAREA></TD> </TR> </TBODY> </TABLE> </CENTER> <P> <CENTER> <INPUT onblur=merci() type=submit value=" Appliquer pour commander"> <INPUT name=reset type=reset value=Effacer> </CENTER> </P> </FORM>
et tu rajoutes ces lignes où tu veux
<script type="text/javascript"> function addition() { var prix01=document.formulaire.prix01.value var prix02=document.formulaire.prix02.value var prix03=document.formulaire.prix03.value var prix04=document.formulaire.prix04.value var prix05=document.formulaire.prix05.value var prix06=document.formulaire.prix06.value var total=prix01+prix02+prix03+prix04+prix05+prix06 document.formulaire.Total.value=total } </script>
Francyne
 Posté le 31/12/2005 à 17:37 
Aller en bas de la page Revenir au message précédent Revenir en haut de la page
Petite astucienne
Bonjour NoNoZeBeSt, Merci pour votre réponse si rapide. J'ai fait les changement que vous m'avez donné mais lorsque je clique sur la deuxième case, ça me donne une erreur de la page qui s'inscrit dans la barre de tâche au bas de l'écran et ça ne s'additionne pas. Je trouve le code intelligent, il ne doit pas manquer grand chose. J'ai bien mis onChange="addition()" sur tous les champs des prix mais il n'y a rien sur le champ TOTAL, Est-ce qu'on devrait mettre quelque chose? Voir mes changements plus bas. Merci pour votre aide précieuse, Francyne <script type="text/javascript"> function addition() { var prix01=document.formulaire.prix01.value var prix02=document.formulaire.prix02.value var prix03=document.formulaire.prix03.value var prix04=document.formulaire.prix04.value var prix05=document.formulaire.prix05.value var prix06=document.formulaire.prix06.value var total=prix01+prix02+prix03+prix04+prix05+prix06 document.formulaire.Total.value=total } </script> <center><Font size=4 Face="VERDANA,ARIAL,HELVETICA"><B><I>Pour commander, veuillez remplir ce formulaire.<font size=2><br>Entrez le numéro de la boucle désirée, son prix correspondant et le total.<br><font size=2 color=red>(Pour le prix de la boucle, ne pas taper les zéros. Ex.: Si $5.00, taper: 5)</font><br>Au plaisir de vous servir.</I></B></font></font></center> <br> <form action="mailto:fd@cybernaute.com?subject=Commande de boucles" method=post ENCTYPE="text/plain" name="formulaire"> <CENTER> <TABLE border=3 width="100%" bgcolor=#E4E7F4> <TBODY> <TR> <TD><FONT face="Times New Roman, Times, serif" color=#000000 size=+0>Boucles 1/2" - 1,30cm:</FONT></TD> <TD><INPUT type="hidden" maxLength=40 name=FRANÇAIS: Boucles 1/2po Quantité: size="10" value=" "></TD> </TR> <TR> <TD><FONT face="Times New Roman, Times, serif" color=#000000 size=+0>Numéro de la boucle:</FONT></TD> <TD> <INPUT type="text" maxLength=40 name=Numero01 size="5" value=" "> <INPUT type="text" maxLength=40 name=Numero02 size="5" value=" "> <INPUT type="text" maxLength=40 name=Numero03 size="5" value=" "> <INPUT type="text" maxLength=40 name=Numero04 size="5" value=" "> <INPUT type="text" maxLength=40 name=Numero05 size="5" value=" "> <INPUT type="text" maxLength=40 name=Numero06 size="5" value=" "> </TD> </TR> <TR> <TD><FONT face="Times New Roman, Times, serif" color=#000000 size=+0>Prix/l'unité: <font size=2>(Ne pas taper les zéros)</FONT></TD> <TD> <INPUT type="text" maxLength=40 name=prix01 size="5" value=" " onChange="addition()" > <INPUT type="text" maxLength=40 name=prix02 size="5" value=" " onChange="addition()" > <INPUT type="text" maxLength=40 name=prix03 size="5" value=" " onChange="addition()" > <INPUT type="text" maxLength=40 name=prix04 size="5" value=" " onChange="addition()" > <INPUT type="text" maxLength=40 name=prix05 size="5" value=" " onChange="addition()" > <INPUT type="text" maxLength=40 name=prix06 size="5" value=" " onChange="addition()" > </TD> </TR> <TR> <TD><FONT face="Times New Roman, Times, serif" color=#000000 size=+0>Total: <font size=2>(Taper le montant sans les zéros)</font></FONT></TD> <TD><INPUT type="text" maxLength=40 name=total size="10" value=" "></TD> </TR>
NoNoZeBeSt
 Posté le 31/12/2005 à 17:52 
Aller en bas de la page Revenir au message précédent Revenir en haut de la page
Petit astucien
je suis désolé je ne trouve pas l'erreur, peut-etre que quelqu'un pourra t'aider, mais ce soir je dois partir bonne chance et bonnes fêtes de fin d'année
Francyne
 Posté le 31/12/2005 à 18:04 
Aller en bas de la page Revenir au message précédent Revenir en haut de la page
Petite astucienne
Bonne Année 2006 NoNoZeBeSt. Ce n'est pas grave. En espérant que quelqu'un d'autre pourra m'aider. Francyne
yct62
 Posté le 31/12/2005 à 18:48 
Aller en bas de la page Revenir au message précédent Revenir en haut de la page
Petit astucien
dans ta fonction addition tu n'aurais pas oublié des ";"?? et par la meme occasion quand tu fais onChange="addition();" oublie pas les ";"
Francyne
 Posté le 31/12/2005 à 19:15 
Aller en bas de la page Revenir au message précédent Revenir en haut de la page
Petite astucienne
Bonjour Yct62, J'ai mis des ; après la fonction et sur le formulaire onChange mais ça crée une erreur : <script type="text/javascript"> function addition(); { var prix01=document.formulaire.prix01.value var prix02=document.formulaire.prix02.value var prix03=document.formulaire.prix03.value var prix04=document.formulaire.prix04.value var prix05=document.formulaire.prix05.value var prix06=document.formulaire.prix06.value var total=prix01+prix02+prix03+prix04+prix05+prix06 document.formulaire.total.value=total } </script> J'ai eu ce code de NoNoZeBeSt. Lorsque je saisie un chiffre, ce dernier s'affiche dans la case total mais si je saisie un autre chiffre dans une autre case, l'addition ne de fait pas. Exemple: Si je mets: 5 dans la première case et 5 dans la deuxième case, il s'affiche 55 dans la case Total alors que je devrais avoir : 10. Je sais que ce n'est pas de la p'tit bière que je demande, mais j'imagnine que ça pourrait se faire certainement. Merci à plutard j'espère, Francyne
yct62
 Posté le 31/12/2005 à 19:35 
Aller en bas de la page Revenir au message précédent Revenir en haut de la page
Petit astucien
non pas comme ca, lol, regarde : <script type="text/javascript"> function addition() { var prix01=document.formulaire.prix01.value; var prix02=document.formulaire.prix02.value; var prix03=document.formulaire.prix03.value; var prix04=document.formulaire.prix04.value; var prix05=document.formulaire.prix05.value; var prix06=document.formulaire.prix06.value; var total=prix01+prix02+prix03+prix04+prix05+prix06; document.formulaire.total.value=total; } </script>
Francyne
 Posté le 31/12/2005 à 19:42 
Aller en bas de la page Revenir au message précédent Revenir en haut de la page
Petite astucienne
J'ai bien fait un copier coller de ton code mais ça donne toujours le même résultat. Le chiffre de la case 1 (5) s'affiche dans total et la case 2 (5) s'affiche à la suite de l'autre 5 dans la case total. Comme ceci: Total: 55 au lieu de 10 Si je mets un autre chiffre dans la 3ième case le total devienr: 555 et non 15 et ainsi de suite. L'addidion ne se fait pas. à bientôt avec beaucoup d'espoir [smile] Francyne
Publicité
yct62
 Posté le 31/12/2005 à 20:01 
Aller en bas de la page Revenir au message précédent Revenir en haut de la page
Petit astucien
essaye de faire : 'prix01'+'prix02'+....
Francyne
 Posté le 31/12/2005 à 20:06 
Aller en bas de la page Revenir au message précédent Revenir en haut de la page
Petite astucienne
eh bien ça ne fonctionne pas. Au lieu d'avoir le chiffre dans la case total, j'ai toute la ligne de prix. Si jamais tu trouves, j'en serais vraiment contente. Merci, Francyne
NoNoZeBeSt
 Posté le 31/12/2005 à 23:56 
Aller en bas de la page Revenir au message précédent Revenir en haut de la page
Petit astucien
Re, essaie comme cela
function addition() { var prix01=document.formulaire.prix01.value; var prix02=document.formulaire.prix02.value; var prix03=document.formulaire.prix03.value; var prix04=document.formulaire.prix04.value; var prix05=document.formulaire.prix05.value; var prix06=document.formulaire.prix06.value; var total=Number(prix01+prix02+prix03+prix04+prix05+prix06); document.formulaire.total.value=total; }
Francyne
 Posté le 01/01/2006 à 00:46 
Aller en bas de la page Revenir au message précédent Revenir en haut de la page
Petite astucienne
Rebonjour NoNoZeBeSt, C'est pas drôle de travailler la veille du jour de l'an, Hein? J'ai essayé ton code suivant et lorsque je tape le deuxième chiffre dans la case 2, ça me donne: NaN dans la case total. Mais lorsque je tape le premier chiffre, ça inscrit le chiffre correctement dans la case total. C'est la formule de l'addition qui fait défaut. Je te mets la page de test pour voir le résultat. Merci, à bientôt. www.cybernaute.com/francyne.deschenes/BouclesBows/test.htm function addition() { var prix01=document.formulaire.prix01.value; var prix02=document.formulaire.prix02.value; var prix03=document.formulaire.prix03.value; var prix04=document.formulaire.prix04.value; var prix05=document.formulaire.prix05.value; var prix06=document.formulaire.prix06.value; var total=Number(prix01+prix02+prix03+prix04+prix05+prix06); document.formulaire.total.value=total; }
NoNoZeBeSt
 Posté le 01/01/2006 à 11:03 
Aller en bas de la page Revenir au message précédent Revenir en haut de la page
Petit astucien
c'est vrai, et en plus je reprend les cours dans deux jours... pour ton problème essaie comme cela :
function addition() { var prix01=new Number(document.formulaire.prix01.value); var prix02=new Number(document.formulaire.prix02.value); var prix03=new Number(document.formulaire.prix03.value); var prix04=new Number(document.formulaire.prix04.value); var prix05=new Number(document.formulaire.prix05.value); var prix06=new Number(document.formulaire.prix06.value); var total=Number(prix01+prix02+prix03+prix04+prix05+prix06); document.formulaire.total.value=total; }
et j'espère que ça va fonctionner cette fois-ci
Francyne
 Posté le 01/01/2006 à 14:57 
Aller en bas de la page Revenir au message précédent Revenir en haut de la page
Petite astucienne
Youpi...Youpi...Youpi. Vive NoNoZeBeSt, tu es le meilleur. Ça fonctionne tempête, je suis tellement heureuse, j'en reviens pas. Quel beau cadeau que tu me fais pour le nouvel an. Merci beaucoup, tu es mon ange. Amicalement, Francyne
NoNoZeBeSt
 Posté le 01/01/2006 à 17:43 
Aller en bas de la page Revenir au message précédent Revenir en haut de la page
Petit astucien
Merci de tous ces compliments, je vais finir par rougir si ça continue[rougir] Je te souhaite une bonne continuation pour ton site et en cas de problème le forum PC Astuces est là pour t'aider @+

Modifié par NoNoZeBeSt le 01/01/2006 17:44
Page : [1] 
Page 1 sur 1

Vous devez être connecté pour participer à la discussion.
Cliquez ici pour vous identifier.

Vous n'avez pas de compte ? Créez-en un gratuitement !
Recevoir PC Astuces par e-mail


La Lettre quotidienne +226 000 inscrits
Avec l'actu, des logiciels, des applis, des astuces, des bons plans, ...

Les bonnes affaires
Une fois par semaine, un récap des meilleurs offres.

Les fonds d'écran
De jolies photos pour personnaliser votre bureau. Une fois par semaine.

Les nouveaux Bons Plans
Des notifications pour ne pas rater les bons plans publiés sur le site.

Les bons plans du moment PC Astuces

Tous les Bons Plans
59,95 €Disque dur externe portable Seagate Basic 2 To USB 3.0 à 59,95 €
Valable jusqu'au 01 Mars

Amazon fait une promotion sur le disque dur externe portable Seagate Basics d'une capacité de 2 To qui passe à 59,95 € livré gratuitement. Ce disque dur externe portable au format 2,5 pouces dispose d'une interface USB 3.0 compatible USB 2.0. Une excellente affaire pour ce disque dur qui offre des débits de 115 Mo/s. Il n'est pas soudé et est donc démontable si vous souhaitez le réutiliser ailleurs (console, NAS, PC).


> Voir l'offre
291,73 €Smartphone Samsung M51 (6,7 pouces FHD+, 6 Go RAM, 128 Go) à 291,73 € livré
Valable jusqu'au 01 Mars

Amazon Espagne fait une belle promotion sur le nouveau smartphone Samsung M51 qui passe à 286,61 € (avec la TVA ajustée). Comptez 5,12 € pour la livraison en France soit un total de 291,73 € livré alors qu'on le trouve ailleurs à partir de 359 €. Le smartphone Samsung Galaxy M51 dispose d'un écran Super AMOLED6.7 pouces d'une résolution de 1080 x 2400 pixels, d'un processeur 8 coeurs Snapdragon 730G et 6 Go de RAM. 128 Go de stockage sont présents et sont extensibles par MicroSD (512 Go max). Pour les moments inattendus de la vie, le quadruple appareil photo est idéal. Prenez de superbes photos de votre monde avec un appareil photo principal de 64 MP ou obtenez une image plus large avec l’angle de vue de 123 ° de l’objectif ultra grand angle 12 MP. Le capteur de profondeur 5 MP ajoute un flou d’arrière-plan et l’objectif macro 5 MP optimise la mise au point sur les gros plans.  A l'avant, un appareil photo 32 MP vous permettra de réaliser vos selphies avec un léger flou d'arrière-plan grâce à la mise au point en direct. Il est soutenu par une batterie de 7000 mAh avec recharge rapide. Les fonctionnalités de connectivité du smartphone incluent WiFi, Bluetooth, GPS, Volte, etc. 

Le Galaxy M51 dispose d’un capteur d’empreinte digitale à l’arrière pour vous connecter aux applications compatibles et déverrouiller votre appareil en toute simplicité. Le tout tourne sous Android 10 en français et est garanti 2 ans. Vous pouvez commander avec votre compte Amazon FR sur Amazon ES et il n'y a pas de douane.


> Voir l'offre
171,99 €Ecran 24 pouces Iiyama G2470HSU-B1 (FullHD, IPS, 1 ms, 165 Hz) à 171,99 €
Valable jusqu'au 28 Février

Cdiscount fait une promotion sur l'écran 24 pouces Iiyama G2470HSU-B1 qui passe à 171,99 € alors qu'on le trouve ailleurs à partir de 200 €. Cet écran à bord fin possède une dalle IPS FullHD (1920x1080px), offre un temps de réponse de 1 ms, une vitesse de rafraichissement de 165 Hz. Il est compatible FreeSync. Il possède 2 ports HDMI et un port DP.


> Voir l'offre

Sujets relatifs
champs obligatoire dans un formulaire
Envoi checkbox par mail dans formulaire php
Insérer un formulaire dans page " Contact"
recuperation formulaire dans les variables php
Calcul dans formulaire php
où placer le formulaire de contact dans DW 8
réïtération de lecture de champs dans une boucle
Retour chariot dans formulaire
champs caché destinataire formulaire contact php
inserer un lien dans un formulaire de saisie
Plus de sujets relatifs à Addition de champs dans un formulaire
 > Tous les forums > Forum Forum des Webmasters