Calcul automatique champs input type number

Résolu

Odd89 Messages postés 51 Date d'inscription Statut Membre Dernière intervention -
Odd89 Messages postés 51 Date d'inscription Statut Membre Dernière intervention - 1 sept. 2016 à 13:35

Bonjour à tous,

Je souhaiterai avoir votre aide pour faire un calcul automatique en récupérant un chiffre qui est dans une variable PHP et un autre chiffre qui ce situe dans un input de type number (Que l'on peut incrémenté grâce au bouton + ou -)

Ma variable PHP : $nourriture contient 50
Mon input contient 0

Quand je fais passé mon input à 1, je voudrais avoir le calcul suivant 50*1 et que je puisse ensuite afficher le résultat sans avoir a recharger la page.

Voici mon code de test :

<html>
	<head>
		<script type="text/javascript">
			function calcul(){
                var quantite = Number(document.getElementById("nb_unitee").value);
 
                var ressource = Number(document.getElementById("nourriture").value);
 
                var total_ressource = Number(quantite * ressource);
                document.getElementById("total_ressource").value = total_ressource;
            }
 
		</script>
	</head>
	<body>
	<?php $nourriture = 50; ?>
		<form name="fact">
 
			<label>Nombre d'unitée :</label><input name="nb_unitee" id="nb_unitee" type="number" min="0" max="200" step="1" onkeypress="return false;" onblur="calcul()" ><!-- <input type="text" SIZE="1" name="nb_unitee" id="nb_unitee" onblur="calcul()" > -->
			<br />
			<input type="hidden" SIZE="1" name="nourriture" id="nourriture" value="50" onblur="calcul()" > <!-- Parce que je ne sais pas envoyer une varriable dans une fonction javascript... -->
			<br />
			<label>Total Ressources :</label><input type="text" SIZE="33" STYLE="text-decoration:none;;color: #FF0000;" name="total_ressource" id="total_ressource"><br/><br/>		
			<br/>
			<br/>	
			<label><input type="submit" value="Enregistrer" name="recfacture"></label><br><br>
		</form>
	</body>
</html>

Merci beaucoup pour votre aide !

A voir également:

Calcul automatique champs input type number
Réponse automatique thunderbird - Guide
Recherche automatique des chaînes ne fonctionne pas - Guide
Logiciel de sauvegarde automatique gratuit - Guide
Calcul moyenne excel - Guide
Calcul km marche à pied gratuit - Télécharger - Sport

1 réponse

Réponse 1 / 1

Pitet Messages postés 2826 Date d'inscription Statut Membre Dernière intervention 527

Salut,

PHP est exécuté sur le serveur contrairement à javascript qui est exécuté sur le navigateur, le javascript ne pourras donc pas utiliser directement une variable PHP.

Par contre, puisque PHP permet de générer du code html, la solution la plus simple à partir de ton code semble être d'afficher la valeur de la variable PHP dans l'attribut value de l'input hidden :

<input type="hidden" name="nourriture" id="nourriture" value="<?php echo $nourriture; ?>">

Au passage l'attribut onblur sur un input de type hidden est inutile.

Bonne journée,

Odd89 Messages postés 51 Date d'inscription Statut Membre Dernière intervention 3

Je te remercie ! Je récupère bien ma valeur !

En revanche, quand je clique sur le plus et le moins, cela ne me change pas mon "total".

Je suis obliger de cliquer dans le champs et d'en ressortir pour qu'il change.

N'y a t'il pas un autre moyen ?

Pitet Messages postés 2826 Date d'inscription Statut Membre Dernière intervention 527

Utilise plutôt l'événement javascript onchange à la place de onblur dans ce cas.

Odd89 Messages postés 51 Date d'inscription Statut Membre Dernière intervention 3

Yes !! Ça fonctionne !! Je te remercie !!

Peux-tu me dire la différence entre un "onchange" et un "onclick" ?

j'ai l'impression qu'avec un "onclick" cela fonctionne aussi ! xD

Pitet Messages postés 2826 Date d'inscription Statut Membre Dernière intervention 527

Comme leurs noms l'indique, onclick permet de détecter le click sur l'élément tandis que onchange permet de détecter le changement de valeur de l'élément.

L'événement onchange est mieux adapté ici car on peut également changer la valeur de l'input uniquement avec le clavier par exemple, dans ce cas l'événement onclick ne serait pas déclenché et le calcul ne serait donc pas fait.

Avec l'événement onclick, le calcul sera fait dès qu'on cliquera sur l'élément même si la valeur ne change pas, ce qui est inutile ici.

Odd89 Messages postés 51 Date d'inscription Statut Membre Dernière intervention 3

D'accord ! Je te remercie de l'info !

Discussions similaires

input signal out of range

comment désactiver out of range

No video input

Votre réponse

Discussions similaires