Formulaire calcul javascript débutant [Résolu]

Messages postés
62
Date d'inscription
jeudi 11 mai 2006
Statut
Membre
Dernière intervention
28 juin 2011
- - Dernière réponse : Bul3
Messages postés
4934
Date d'inscription
samedi 1 juillet 2006
Statut
Membre
Dernière intervention
2 février 2015
- 24 avril 2009 à 18:19
Bonjour,
J'ai
réalisé un petit formulaire de calcul en javascript et html mais j'ai
un problème pour l'affichage des résultats, voici le code:



<script type= "text/javascript">

function valider(){

f = document.form;

var total_revenus,total_charges,total_credits,res_1,res_2,res_3,resultat;

res_1 = Math.round((total_charges / total_revenus)*100);

alert(res_1);

res_2 = Math.round((total_credits / total_revenus)*100);

alert(res_2);

res_3 = (100 - (res_1 + res_2));

alert(res_3);

resultat = res_1+res_2;

alert(resultat);

f.pr_charg.value = res_1;

f.pr_cred.value = res_2;

f.reste.value = res_3;

}

</script>

</head>



Calcul



<form name ="form">

Revenus nets,

----

Revenu mensuel emprunteur :,

€,

----
Revenu mensuel co-emprunteur :,

€,

----

Autres revenus mensuels récurrents :,

€,

----

 ,

----

Autres charges,

----

Pension alimentaire versée :,

€,

----

Autres charges récurrentes :,

€,

----

Crédits,

Remboursement,

----

1),

€/mois,

----

2),

€/mois,

----

3),

€/mois,

----

,

----

Selon les informations que vous nous avez
données, votre taux est de ,

----

Calcul du pourcentage des charges par rapport
au revenu: ,

----

Calcul du pourcentage du/des crédits par rapport au
revenu: %,

----

Reste à vivre: %


</form>










Donc les
alert(); me donnent bien les résultats mais j'aimerais plutot afficher
ces résultats sous le bouton valider dans du texte (sans input si
possible). Quelqu'un a une idée?
Afficher la suite 

11 réponses

Meilleure réponse
Messages postés
62
Date d'inscription
jeudi 11 mai 2006
Statut
Membre
Dernière intervention
28 juin 2011
1
3
Merci
J'ai utilisé: <form name="frm" onsubmit="valider(); return false;"> et ça fonctionne parfaitement. Merci pour votre aide! C'est parfait.

Dire « Merci » 3

Quelques mots de remerciements seront grandement appréciés. Ajouter un commentaire

Codes Sources 136 internautes nous ont dit merci ce mois-ci

Commenter la réponse de badziz
Messages postés
4934
Date d'inscription
samedi 1 juillet 2006
Statut
Membre
Dernière intervention
2 février 2015
7
0
Merci
Bonjour,

>>mais
j'aimerais plutot afficher ces résultats sous le bouton valider dans du
texte (sans input si possible).
innerHTML d'un div , innerHTML d'un span... ou tout autre balise qui pourrait te plaire
( value ou innerHTML, faut voir )

Cordialement [mon Site] [M'écrire] Bul
Commenter la réponse de Bul3
Messages postés
62
Date d'inscription
jeudi 11 mai 2006
Statut
Membre
Dernière intervention
28 juin 2011
1
0
Merci
J'ai essayé de changer par:
f.pr_charg.innerHTML = res_1;

et dans la partie html:
<td>Reste à vivre:

%</td>

Mais ça ne fonctionne pas, j'ai du oublier quelque chose...
Commenter la réponse de badziz
Messages postés
4934
Date d'inscription
samedi 1 juillet 2006
Statut
Membre
Dernière intervention
2 février 2015
7
0
Merci
>>f.pr_charg.innerHTML
le div n'a pas de name mais un id :
document.getElementById("pr_charg").innerHTML=res_1;
@+
Commenter la réponse de Bul3
Messages postés
62
Date d'inscription
jeudi 11 mai 2006
Statut
Membre
Dernière intervention
28 juin 2011
1
0
Merci
ok merci ça a l'air de fonctionner par contre l'affichage ne dure qu'un bref instant et ensuite tout le formulaire se remet à 0, pourquoi?
Commenter la réponse de badziz
Messages postés
4934
Date d'inscription
samedi 1 juillet 2006
Statut
Membre
Dernière intervention
2 février 2015
7
0
Merci
<form name="form"> ...







ton formulaire est soumis, envoyée à la même page
      car pas d'action= ( elle est rechargée )




     


un formulaire c'est fait pour être envoyé... normalement.
évite les name= à des noms connus !! form ici !
          un jour ou l'autre ça te jouera des tours...
c'est onclick pas on_click !

d'ailleurs tu n'utilises pas une chose normale/standard... pour le submit !
pas de onclick !  et action manque
<form action="page à qui envoyer.htm ou php ou.... " 
            name="frm" onsubmit="return (valider());"> ...

le formulaire sera envoyé vers ce qu'il y a dans action si la fonction
     retourne true, non envoyé sin elle retourne false
si tu ne veux jamais envoyer ( on utilise rarement un bouton submit
dans ce cas ) mais

<form name="frm" onsubmit="void(valider());"> ...
Commenter la réponse de Bul3
Messages postés
62
Date d'inscription
jeudi 11 mai 2006
Statut
Membre
Dernière intervention
28 juin 2011
1
0
Merci
pour le on_click pas de soucis c'était bien onClick dans mon code ;)

Pour ce qui est d'envoyé le formulaire, justement celui là ne doit pas être envoyé et simplement afficher les résultats.
J'ai fait les changements mais apparemment toujours le même problème. Voila ce que mon code donne:
<script type= "text/javascript">
function valider(){

    f = document.frm;
    var total_revenus,total_charges,total_credits,res_1,res_2,res_3,resultat = 0;

    total_revenus = parseInt(f.rev_emp.value) + parseInt(f.rev_coemp.value) + parseInt(f.rev_autres.value);
    total_charges = parseInt(f.chg_pensions.value) + parseInt(f.chg_autres.value);
    total_credits = parseInt(f.remb1.value) + parseInt(f.remb2.value) + parseInt(f.remb3.value);
   
   
        if(total_revenus == 0){
        alert("Veuillez indiquer au moins un revenu.");
        f.rev_emp.focus();
        return false;
        }

    res_1 = Math.round((total_charges / total_revenus)*100);
    res_2 = Math.round((total_credits / total_revenus)*100);
    res_3 = (100 - (res_1 + res_2));
    resultat = res_1+res_2;

    document.getElementById("resultat").innerHTML=resultat;
    document.getElementById("pr_charg").innerHTML=res_1;
    document.getElementById("pr_cred").innerHTML=res_2;
    document.getElementById("reste").innerHTML=res_3;

}
</script>
</head>

Calcul

<form name ="frm" onSubmit="void(valider());" action="taux_endettement.html">
    ----

        Revenus nets,

   
    ----

        Revenu mensuel emprunteur :,
        &euro;,
   
    ----

        Revenu mensuel co-emprunteur :,

        &euro;,
   
    ----

        Autres revenus mensuels récurrents :,
        &euro;,
   
    ----

        &nbsp;,
   
    ----

        Autres charges,
   
    ----

        Pension alimentaire versée :,
        &euro;,

   
    ----

        Autres charges récurrentes :,
        &euro;,
   
   
    ----

     Crédits,
     Remboursement,
  
  
    ----

     1),

              &euro;/mois,
  
  
   ----

     2),

              &euro;/mois,
  
  
    ----

     3),

              &euro;/mois,
  

   
----

                ,

----
Selon les informations que vous nous avez données, votre taux est de,

----
Calcul du pourcentage des charges par rapport au revenu:

%,

----

        Calcul du pourcentage du/des crédits par rapport au revenu:

%,

----

        Reste à vivre:

%

</form>
Commenter la réponse de badziz
Messages postés
1700
Date d'inscription
vendredi 9 mai 2008
Statut
Modérateur
Dernière intervention
17 juin 2019
39
0
Merci
bonjour
c'est ta facon d'appeler la function qui est mauvaise
normalement de cette facon ca devrait marcher

'>resultat
Commenter la réponse de @karamel
Messages postés
4934
Date d'inscription
samedi 1 juillet 2006
Statut
Membre
Dernière intervention
2 février 2015
7
0
Merci
<form name="frm" onsubmit="valider(); return false;">
si pas d'envoi, action inutile.
sans préjuger du reste....
Commenter la réponse de Bul3
Messages postés
1700
Date d'inscription
vendredi 9 mai 2008
Statut
Modérateur
Dernière intervention
17 juin 2019
39
0
Merci
aussi
Commenter la réponse de @karamel
Messages postés
4934
Date d'inscription
samedi 1 juillet 2006
Statut
Membre
Dernière intervention
2 février 2015
7
0
Merci
nickel si ça baigne.     merci du retour.
Commenter la réponse de Bul3