Affichage résultat de calcul pour Jquery

Version imprimable

12/12/2017, 19h01
geekette78

Affichage résultat de calcul pour Jquery

Bonjour,

Débutante ou presque en JavaScript, je bute sur un problème, et j'espère que vous pourrez aidez une geekette...
Je mets au point un calculateur, et j'affiche les résultats dans ma page HTML avec des <input>. Les lignes du calculateurs sont nombreuses puisque je calcule beaucoup de paramètres, mais les résultats sont corrects et bien affichés.

Le problème est que je voudrais les afficher sur ma page sans <input>, pour les utiliser afin de faire une barre de rating jQuery (barre qui fonctionne très bien avec des données brutes, non issues des calculs)...

J'ai essayé de récupérer les résultats par les méthodes suivantes, rien ne fonctionne...
<p id="test"></p>, <output name="test">, <div id="test"></div>...

Le seul moment où j'arrive à récupérer une donnée en dehors d'un input, c'est quand j'utilise le document.getElementById précisément là dans la page où je devrais afficher le résultat. Seulement ça fonctionne avec un calcul basique (genre 2+1), mais pas lorsque j'attribue le nom de la variable de résultat calculé plus haut, du genre document.getElementById("revenu").value = revenu.toFixed(0);

Alors comment faire pour récupérer un résultat de calcul issu d'une fonction dans une page HTML sans input ?

Merci à ceux qui pourront m'aider...
13/12/2017, 12h09
Toufik83

bonjour,
si t'utilise jQuery t'auras plus de fonctions utiles qui peuvent bien te servir mieux que ça.
l'équivalent de document.getElementById('test').value='X'; en jQuery c'est $("#test").text('X');.(si test n'est pas un input)
la documentation est :ICI.
un autre petit exemple dans un éditeur en ligne.
13/12/2017, 12h16
Invité

Bonjour,

On ne comprend pas très bien où tu veux en venir... ni ce qui te bloque.

Merci de nous donner un petit exemple SIMPLE de CALCUL que tu souhaites réaliser, avec, éventuellement, le code HTML et JS associé.

Bonjour,

Merci de vos réponses.

En gros voici une partie du calcul

Dans la partie <head> :
Code:

1 2 3 function calcul3(){ var loyertotal2 = Number(loyernormal * surface*12); document.getElementById("loyertotal2").value = loyertotal2.toFixed(0);
Dans la partie html, une partie du formulaire calculatrice :
Code:

1 2 3 <input name="surface" type="text" id="surface" /> <input name="loyernormal" type="text" id="surface" /> <input type="button" onClick="calcul3()" value="Calculer" class="myButton3">
Toujours dans la partie html, là où j'affiche les résultats :

Code:

<input name="loyertotal2" type="text" id="loyertotal2" readonly/>

Jusque là tout va bien, sauf que je voudrais récupérer ce résultat afficher une barre jquery :
Dans ma partie head :
Code:

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 <script type="text/javascript" charset="utf-8"> $(document).ready(function() { // Custom markup var ratingconfig = { animate: true, duration: 1000, ease: "easeOutBounce", maxRating: 10, wrapperWidth: 120, showText: true, wrapperClass: "wrapper_books", innerClass: "inner_books", textClass: "rating_books" } $('.book_rating').ratingbar(ratingconfig); // Dynamically update the rating if the value changes $("#bumper").click(function() { var randomrating1=Math.floor(Math.random()*11) $("#book1 ." + ratingconfig.textClass).text(randomrating1); var randomrating2=Math.floor(Math.random()*11) $("#book2 ." + ratingconfig.textClass).text(randomrating2); $('.book_rating').ratingbar('update', ratingconfig); }); }); </script>
Dans ma partie HTML :

Code:

<td id="book1" class="book_rating">//Là je devrais récupérer la donnée</td>

Si je marque une valeur à la main dans cette balise td, tout va bien. Mais je n'arrive ni à afficher la donnée brute sans <input>...

Je viens d'essayer de passer par $("#test").text('X'); mais ça ne fonctionne pas...

13/12/2017, 17h21
Toufik83
Citation:

Envoyé par geekette78

Je viens d'essayer de passer par $("#test").text('X'); mais ça ne fonctionne pas...

cela ne fonctionne pas par ce que tu ne cible pas le bon Id.
tu veux afficher ta_valeur dans <td id="book1" class="book_rating"></td>, alors il faut faire :

Code:

$("#book1").text(ta_valeur);

attention aussi aux id identiques, tu as deux éléments avec le même id id="surface"et ça c'est pas bon.
Code:

1 2 <input name="surface" type="text" id="surface" /> <input name="loyernormal" type="text" id="surface" />