Affichage résultat de calcul pour Jquery

**geekette78** · 12/12/2017, 19h01

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...

**Toufik83** · 13/12/2017, 12h09

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.

Invité · 13/12/2017, 12h16

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é.

**geekette78** · 13/12/2017, 15h16

Bonjour,

Merci de vos réponses.

En gros voici une partie du calcul

Dans la partie <head> :

Code :

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

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 :

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

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 :

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

 <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 :

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
<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 :

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

<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...

**Toufik83** · 13/12/2017, 17h21

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 :

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

$("#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 :

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

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

Affichage résultat de calcul pour Jquery

jQuery

Discussions similaires

Partager

Partager