Comment synchroniser des variables automatiquement

bonjour a tous

est-il possible de rafraichir des variables l'intérieur d'un form ?

Dans mon bon de commande le total de la commande est mise dans cette variable MonPanier.totalpanier()

ensuite j'utilise cette même variable dans le code ci dessous 

var formu = document.getElementById("formsu");
formu.onclick = function(e){
  e.preventDefault();
var names = document.getElementById("names").value;
  console.log(names);
if (names == 'promotion') {
	document.getElementById("prints").innerHTML = MonPanier.totalpanier();
}

          <label>
<input type="radio" name="promotioncases" id="vert" data-target="30" value="30" />
</label>
<div id="30" class="descendre">
   <span>tu n'as pas de code promo</span>
   <form name="formu" id="formsu">
      Entre ton code promo:   <input type="text" id="names" />
      <input type="button" value=" Valide ton code promo" />
   </form>
   <p id="test"></p>
   <br />
</div>
                         
                       
                   
              
                     
             

Mais je me retrouve confronté a un soucis 

la variable contenue dans le code form ne se mets pas a jour de façon automatique avec l'autre qui sers donc a récupérer la commande 

le seul moyen que j'ai trouvé et que l'utilisateur entre un code et le valide et a ce moment la variable se met a jour 

Donc ma question est de savoir comment je pourrais m'y prendre pour que la variable contenue dans le form MonPanier.totalpanier() soit synchro avec celle qui reçoit la commande 

je pourrais faire un message d'erreur en disant qu 'il doit revalider si les deux variables ne sont pas égale

Mais cela demande encore une manipulation en plus pour l'utilisateur