IdentifiantMot de passe
Loading...
Mot de passe oublié ?Je m'inscris ! (gratuit)
Navigation

Inscrivez-vous gratuitement
pour pouvoir participer, suivre les réponses en temps réel, voter pour les messages, poser vos propres questions et recevoir la newsletter

JavaScript Discussion :

Afficher une variable dans un formulaire.


Sujet :

JavaScript

  1. #1
    Membre à l'essai
    Profil pro
    Inscrit en
    Juin 2009
    Messages
    28
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Juin 2009
    Messages : 28
    Points : 21
    Points
    21
    Par défaut Afficher une variable dans un formulaire.
    Bonjours! Je cherche à récupérer un variable donnée calculée en javascript.
    Ce sera plus clair si je l'explique avec le code:

    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
    <br>Maîtrise du combat: 
    <input type="text" 
    name="xp_maitrise_du_combat" 
    id="xp_maitrise_du_combat" 
    value="0" 
    onKeyup="check1();">
    //ici, on récupère la quantité d'Xp que le joueur dépense. La fonction check1 calcule en fonction de cet Xp combien le joueur acquiert de point de "maitrise de combat".
    Xp= <span id="result_maitrise_du_combat"></span> 
    //ici, on affiche la valeur calculée par check1 
     
    <input type="hidden" 
    name="maitrise_du_combat" 
    value="result_maitrise_du_combat">
    //ici, on est censé récupérer la valeur pour l'envoyer vers la page suivante. Les balises FORM sont omises sur ce bout de code, mais elle sotn présente sur le code entier.
     
    <script type="text/javascript">
    function check1() {
     var maitrise_du_combat = document.getElementById("xp_maitrise_du_combat").value;
     
    var result_maitrise_du_combat = document.getElementById("result_maitrise_du_combat");
     
     result_maitrise_du_combat.innerHTML = maitrise_du_combat/500;
    }</script>
    Le problème est que la valeur n'est tout simplement pas récupérée par la seconde balise input. Quand je la change en type="text" pour voir ce qu'elle contient, on remarque que c'est "resultat_maitrise_du_combat" qui s'affiche et non sa valeur. Quelqu'un saurait comment y remédier?

    Merci d'avance.

  2. #2
    Expert éminent sénior

    Avatar de vermine
    Profil pro
    Inscrit en
    Mars 2008
    Messages
    6 582
    Détails du profil
    Informations personnelles :
    Âge : 39
    Localisation : Belgique

    Informations forums :
    Inscription : Mars 2008
    Messages : 6 582
    Points : 79 912
    Points
    79 912
    Par défaut
    Bonjour,

    A aucun moment vous ne précisez qu'il faut changer la valeur du champ hidden appelé "maitrise_du_combat" .

  3. #3
    Membre à l'essai
    Profil pro
    Inscrit en
    Juin 2009
    Messages
    28
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Juin 2009
    Messages : 28
    Points : 21
    Points
    21
    Par défaut
    Merci de me répondre=)
    Et... comment pourrais-t-on faire pour faire changer cette valeur?

  4. #4
    Expert confirmé
    Avatar de RomainVALERI
    Homme Profil pro
    POOête
    Inscrit en
    Avril 2008
    Messages
    2 652
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 47
    Localisation : France, Meurthe et Moselle (Lorraine)

    Informations professionnelles :
    Activité : POOête

    Informations forums :
    Inscription : Avril 2008
    Messages : 2 652
    Points : 4 164
    Points
    4 164
    Par défaut
    essaie d'affecter la valeur à value et non innerHTML (à la fin de check1)

  5. #5
    Membre à l'essai
    Profil pro
    Inscrit en
    Juin 2009
    Messages
    28
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Juin 2009
    Messages : 28
    Points : 21
    Points
    21
    Par défaut
    Voici ce que donne le code modifié (j'ai enlevé les commentaires pour gagner en lisibilité). Donc, si j'ai bien compris, c'est :
    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
    <br>Maîtrise du combat: 
    <input type="text" 
    name="xp_maitrise_du_combat" 
    id="xp_maitrise_du_combat" 
    value="0" 
    onKeyup="check1();">
    Xp= <span id="result_maitrise_du_combat"></span> 
    <input type="text" 
    name="maitrise_du_combat" 
    value="result_maitrise_du_combat">
     
     
    <script type="text/javascript">
    function check1() {
     var maitrise_du_combat = document.getElementById("xp_maitrise_du_combat").value;
     
    var result_maitrise_du_combat = document.getElementById("result_maitrise_du_combat");
     
     result_maitrise_du_combat.value = maitrise_du_combat/500;
    }</script>
    Apparemment, après test, le même problème se pose avec ce code-ci sauf qu'en plus le premier affichage ne marche plus.
    Ou alors j'ai mal placé le .value?

  6. #6
    Expert éminent sénior

    Avatar de vermine
    Profil pro
    Inscrit en
    Mars 2008
    Messages
    6 582
    Détails du profil
    Informations personnelles :
    Âge : 39
    Localisation : Belgique

    Informations forums :
    Inscription : Mars 2008
    Messages : 6 582
    Points : 79 912
    Points
    79 912
    Par défaut
    Je maintiens qu'à aucun moment vous ne précisez qu'il faut changer la valeur du champ hidden appelé "maitrise_du_combat" . Vous confondez le champ hidden dont le value ressemble à l'id du span. Pour le span, il faut faire un innerText, pas pour le champ hidden. Vous désirer affecter deux éléments mais vous n'en modifiez qu'un seul.

  7. #7
    Membre à l'essai
    Profil pro
    Inscrit en
    Juin 2009
    Messages
    28
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Juin 2009
    Messages : 28
    Points : 21
    Points
    21
    Par défaut
    Merci, cependant quelques explication serait nécessaire sur deux points?
    Citation Envoyé par vermine
    Vous confondez le champ hidden dont le value ressemble à l'id du span.
    La value du champ hidden doit justement être la même que celle qui apparait dans le span.
    Pour le span, il faut faire un innerText, pas pour le champ hidden.
    Dans ce cas, que faut-il faire pour le champ hidden?
    Et pour être plus performant et correct, ce serait mieux de faire le document.getElementById sur... un id.
    Ici, vous parlez bien d'attribuer un id au champ hidden? J'y ai pensé, mais étant donné qu'il faut que les valeurs soit identiques entre lui et le span, il faudrait leurs attribuer le même id, ce qui n'est pas (a ma connaissance) possible?

  8. #8
    Expert éminent sénior

    Avatar de vermine
    Profil pro
    Inscrit en
    Mars 2008
    Messages
    6 582
    Détails du profil
    Informations personnelles :
    Âge : 39
    Localisation : Belgique

    Informations forums :
    Inscription : Mars 2008
    Messages : 6 582
    Points : 79 912
    Points
    79 912
    Par défaut
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    <span id="result_maitrise_du_combat"></span> 
    //ici, on affiche la valeur calculée par check1 
     
    <input type="hidden" 
    name="maitrise_du_combat" 
    value="result_maitrise_du_combat">
    Vous donnez comme valeur un joli petit texte à votre hidden. Celui qui apparait quand vous changez le hidden en text. Rien d'anormal à ce phénomène. Etiez-vous en train de penser qu'en précisant l'id du span dans le value du hidden, vous alliez lier le span et le hidden ? Hé bien non.

    Chaque élément doit se voir affecter de sa valeur. Faire innerText pour le span, est une chose, mais il faut aussi faire un document.getElementById(...) du hidden car ce sont bel et bien deux éléments différents et ils n'ont aucun lien.
    Alors oui, il faut donner un id au hidden. Et effectivement, il ne pourra pas s'agir du même que celui du span. Mais qu'importe, vu qu'on vient de comprendre qu'ils n'étaient pas lié. Vous pouvez donner l'id que vous voulez à votre hidden, et ensuite, lui affecter la même valeur (maitrise_du_combat/500) avec un .value comme vous l'avez utilisé dans votre deuxième tentative.

  9. #9
    Membre à l'essai
    Profil pro
    Inscrit en
    Juin 2009
    Messages
    28
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Juin 2009
    Messages : 28
    Points : 21
    Points
    21
    Par défaut
    Ouais! Ca marche!
    Super=) merci d'avoir pris le temps d'expliquer en détails.
    Résolu!

  10. #10
    Expert éminent sénior

    Avatar de vermine
    Profil pro
    Inscrit en
    Mars 2008
    Messages
    6 582
    Détails du profil
    Informations personnelles :
    Âge : 39
    Localisation : Belgique

    Informations forums :
    Inscription : Mars 2008
    Messages : 6 582
    Points : 79 912
    Points
    79 912
    Par défaut
    Au plaisir.
    J'ai préféré ne pas donner de code et vous forcer à réfléchir un minimum à ce que vous aviez écrit. C'est ainsi qu'on apprend, pas en recopiant.

+ Répondre à la discussion
Cette discussion est résolue.

Discussions similaires

  1. Afficher une photo dans un formulaire
    Par db48752b dans le forum IHM
    Réponses: 7
    Dernier message: 11/09/2006, 12h01
  2. integrer une variable dans un formulaire html
    Par oops! dans le forum Langage
    Réponses: 3
    Dernier message: 08/09/2006, 19h48
  3. Afficher une photo dans un formulaire
    Par boko93 dans le forum Access
    Réponses: 8
    Dernier message: 04/09/2006, 16h34
  4. Réponses: 7
    Dernier message: 02/08/2006, 15h51
  5. Afficher une table dans un formulaire
    Par noob_vba dans le forum IHM
    Réponses: 8
    Dernier message: 20/06/2006, 16h54

Partager

Partager
  • Envoyer la discussion sur Viadeo
  • Envoyer la discussion sur Twitter
  • Envoyer la discussion sur Google
  • Envoyer la discussion sur Facebook
  • Envoyer la discussion sur Digg
  • Envoyer la discussion sur Delicious
  • Envoyer la discussion sur MySpace
  • Envoyer la discussion sur Yahoo