Discussion :

[Liliana78]

Bonjour,

J'ai un script de devis en ligne :

Code html :

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
<p>*</p>
<p>*</p>
<p><span style="font-size: small; font-family: verdana, geneva; color: #ff0000;"><strong>Calculez le coût indicatif de votre correction</strong></span></p>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
<p>*</p>
<form id="testform">
<p><span style="font-size: small; font-family: verdana, geneva;"><strong><label>Nombre de signes </label></strong></span><input id="nbchar" type="nombre" name="nbchar" value="0" /></p>
<p><span style="text-decoration: underline;"><em><span style="font-size: x-small; font-family: verdana, geneva;">Où trouver le nombre de signes ?</span></em></span></p>
<p><em><span style="font-size: x-small; font-family: verdana, geneva;">Word 2007/2010 : *Cliquez sur*sur l'onglet*<strong>Révisions</strong>, puis*<strong>Vérification</strong>*et enfin*<strong>Statistiques</strong>. Repérez la ligne<strong>*caractères espaces compris.</strong></span></em></p>
<p><em><span style="font-size: x-small; font-family: verdana, geneva;">Word 2003/OpenOffice :*<span>Cliquez sur*</span><strong>Outils</strong><span>, puis*</span><strong>Statistiques.*</strong><span>Repérez la ligne</span><strong>*caractères espaces compris.</strong></span></em></p>
<p><br /> <span style="font-size: small;"><label><strong>Formule</strong> </label></span><input type="radio" name="formule" value="1" checked="checked" /> Simple <input type="radio" name="formule" value="2" /> Approfondie</p>
<p><em><span style="font-size: x-small; font-family: verdana, geneva;">Voir <a href="formules/correction-reformulation">tableau comparatif</a></span></em></p>
<p><br /> <span style="font-size: small; font-family: verdana, geneva;"><strong><label>Statut </label></strong></span></p>
<select id="formjur" name="formjur">
<option value="0">Etudiant</option>
<option value="1">Particulier</option>
<option value="2">Professionnel</option>
</select><input type="submit" value="Calculer" /></form>
<div id="resultat">*</div>
<p>*</p>

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
$(function(){
 
        $("input:submit").click(
            function(){
                var calcul = 0;
                if($("input:checked").val() == 1){
                    if($("#formjur").val()== 1){
                        calcul = $("#nbchar").val() * 0.0029;
                    }else if ($("#formjur").val()== 2) {
                        calcul = $("#nbchar").val() * 0.0033;
                    }else{
                        calcul = $("#nbchar").val() * 0.0025;
                    }
                }else{
                    if($("#formjur").val()== 1){
                        calcul = $("#nbchar").val() * 0.004375;
                    }else if ($("#formjur").val()== 2) {
                        calcul = $("#nbchar").val() * 0.005;
                    }else{
                        calcul = $("#nbchar").val() * 0.00375;
                    }
                }
                var resultat = Math.ceil(calcul);
                $("#resultat").html("Le montant indicatif de votre devis est de <b>"+resultat+"<b> &euro;");
                return false;
            }
 
        );
 
    });

Je cherche, sans succès, à appliquer un tarif dégressif (-10 % à partir de 100 000 signes ; - 15 % à partir de 200 000 signes).

Merci énormément de votre aide.

Liliana

[Watilin]

Pourquoi ne pas avoir continué cette conversation ?

Plutôt que te donner du code, je vais te donner la logique à suivre en langue française. Je t'ai déjà montré comment utiliser les opérateurs de comparaison (<, >, <=, >=) et le && pour faire des fourchettes. Ensuite, les pourcentages ne sont rien de plus que des fractions de 100, donc par exemple pour une réduction de 10 %, tu multiplies le tarif de base par 10 puis tu divises par 100 ; pour 15 % tu multiplies par 15 (toujours en divisant par 100 après) ; etc.

Attention, je te conseille fortement de manipuler tes prix en unités basses (les centimes d'euros) pour éviter autant que possible de faire des calculs avec des chiffres à virgule. La représentation informatique des nombres à « virgule flottante » n'est pas parfaite et il y a parfois des imprécisions. Ce problème n'arrive pas avec les entiers, donc calcule avec des entiers jusqu'au dernier moment, et divise par 100 au moment de l'affichage final du prix.

Une remarque à propos de ton code : ta fonction qui est dans $("input:submit").click( ... ) intercepte la soumission du formulaire, et le return false à la fin permet à ton script de stopper le comportement par défaut du navigateur, qui est d'envoyer les données du formulaire et accessoirement de quitter la page.
Cependant, le clic sur le bouton submit n'est pas le seul moyen de soumettre un formulaire, et par exemple un appui sur la touche entrée alors que le curseur de saisie est dans un des contrôles du formulaire ne sera pas stoppé par ton script. Pour cette raison il vaut mieux que tu places ta fonction dans $("#testform").submit( ... ). De cette manière tu empêches la soumission du formulaire quelle que soit la façon dont elle a été déclenchée.

[Liliana78]

Merci de ta réponse.

En fait, je n'ai pas continué la conversation, car il s'agit d'un autre sujet.

Pour les pourcentages, dur dur...

J'ai suivi ton conseil en remplaçant

Code :

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

$("input:submit").click( ... )

par

Code :

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

$("#testform").submit( ...)

, mais le formulaire cesse alors de fonctionner.

Liliana

[Watilin]

Je peux voir le code ?

[Liliana78]

Le voici :

Code html :

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
<p>*</p>
<p><strong style="color: #000080; font-family: verdana, geneva; font-size: small; line-height: 1.3em;">CALCULEZ LE COÛT INDICATIF DE VOTRE CORRECTION</strong></p>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
<p>*</p>
<form id="testform">
<p><span style="font-size: small; font-family: verdana, geneva;"><strong><label>NOMBRE DE SIGNES </label></strong></span><input id="nbchar" type="nombre" name="nbchar" value="0" /></p>
<p><span style="text-decoration: underline; background-color: #ccffff;"><em><span style="font-size: x-small; font-family: verdana, geneva;">Où trouver le nombre de signes ?</span></em></span></p>
<p><span style="background-color: #ccffff;"><em><span style="font-size: x-small; font-family: verdana, geneva;">Word 2007/2010 : Cliquez sur sur l'onglet <strong>Révisions</strong>, puis <strong>Vérification</strong> et enfin <strong>Statistiques</strong>. Repérez la ligne<strong> caractères espaces compris.</strong></span></em></span></p>
<p><span style="background-color: #ccffff;"><em><span style="font-size: x-small; font-family: verdana, geneva;">Word 2003/OpenOffice : Cliquez sur <strong>Outils</strong>, puis <strong>Statistiques. </strong>Repérez la ligne<strong> caractères espaces compris.</strong></span></em></span></p>
<p><br /> <span style="font-size: small;"><label><strong>FORMULE</strong> </label></span><input type="radio" name="formule" value="1" checked="checked" /> Simple <input type="radio" name="formule" value="2" /> Approfondie</p>
<p><em><span style="font-size: x-small; font-family: verdana, geneva;">Voir <a href="formules/correction-reformulation">tableau comparatif</a></span></em></p>
<p><br /> <span style="font-size: small; font-family: verdana, geneva;"><strong><label>STATUT</label></strong></span></p>
<select id="formjur" name="formjur">
<option value="0">Etudiant</option>
<option value="1">Particulier</option>
<option value="2">Professionnel</option>
</select><input type="submit" value="Calculer" /></form>
<div id="resultat">*</div>
<p>*</p>

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
<script type="text/javascript">// <![CDATA[
$(function(){
      $("#testform").submit( ...)
            function(){
                var calcul = 0;
                if($("input:checked").val() == 1){
                    if($("#formjur").val()== 1){
                        calcul = $("#nbchar").val() * 0.0029;
                    }else if ($("#formjur").val()== 2) {
                        calcul = $("#nbchar").val() * 0.0033;
                    }else{
                        calcul = $("#nbchar").val() * 0.0025;
                    }
                }else{
                    if($("#formjur").val()== 1){
                        calcul = $("#nbchar").val() * 0.004375;
                    }else if ($("#formjur").val()== 2) {
                        calcul = $("#nbchar").val() * 0.005;
                    }else{
                        calcul = $("#nbchar").val() * 0.00375;
                    }
                }
                var resultat = Math.ceil(calcul);
                $("#resultat").html("Le coût indicatif de votre devis est de <b>"+resultat+"<b> &euro;");
                return false;
            }
        );
    });
// ]]></script>

[Watilin]

Tu as écrit les points de suspension tels quels. Inattention ? Quand j'écris du code avec des points de suspension, c'est évidemment invalide au niveau de la syntaxe. C'est juste une manière de te montrer quoi faire en évitant de recopier tout le code…

Les erreurs tu les vois dans la console de ton navigateur, que tu trouves dans les menus « Outils de développement » ou en appuyant sur F12. La console t'indique le motif de l'erreur et la ligne où elle s'est produite. Sers-t'en pour t'aider à résoudre les problèmes. Celui-ci était évident.