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 :

Transformer valeur d'un select en variables javascript. Ajax obligatoire?


Sujet :

JavaScript

Vue hybride

jeffy_berri Transformer valeur d'un... 07/03/2018, 17h59
mathieu quand la valeur du menu... 07/03/2018, 19h58
jeffy_berri Et oui, c'est bien ça le... 07/03/2018, 20h06
mathieu l'AJAX permet une... 07/03/2018, 20h46
jeffy_berri Merci Mathieu pour l'aide, ... 07/03/2018, 22h17
Message précédent Message précédent   Message suivant Message suivant
  1. #1
    Membre actif
    Homme Profil pro
    Webmaster
    Inscrit en
    Janvier 2018
    Messages
    29
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Var (Provence Alpes Côte d'Azur)

    Informations professionnelles :
    Activité : Webmaster

    Informations forums :
    Inscription : Janvier 2018
    Messages : 29
    Par défaut Transformer valeur d'un select en variables javascript. Ajax obligatoire?
    Bonjour,
    Je recherche à transformer la valeur d'un select en une variable javascript.

    Le Code:
    Code html : 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
    <form action="" method="post" name="liste">
     
    <select name="size" id="select" style="width:50px" Onchange="javascript:SelectValueChamp();">
    <option value=10.00 >10</option><option value=20.00 >20</option><option value=30.00 >30</option><option value=40.00 >40</option><option value=50.00 >50</option><option value=60.00 >60</option><option value=70.00 >70</option><option value=80.00 >80</option><option value=90.00 >90</option><option value=100.00 >100</option><option value=110.00 >110</option><option value=120.00 >120</option><option value=130.00 >130</option><option value=140.00 >140</option><option value=150.00 >150</option></select>
     
     <input type="text" name="item_number" value="">
     
    </form> 
    <div id="paypal-button"></div>
     
    <script>
    function showSelectedItem() {
    var item = document.getElementById("select").value;
    document.forms['liste'].elements['item_number'].value=item;
    //var SUBTOTAL =  item; //ne fonctionne pas!
    return item;
    }    
    document.getElementById("select").addEventListener("change", showSelectedItem);
    //var somme = item; //ne fonctionne pas!
    var somme = document.getElementById("select").value; //ne fonctionne pas!
     
     
        var CURRENCY = 'EUR';
        var SUBTOTAL =  somme;
        var TAX = '0.00';
        var SHIPPING = '0.00';
        var SHIPPING_DISCOUNT = '0.00';
        var TOTAL = somme;

    Explication de mon problème:
    Je souhaite pouvoir utiliser la variable "somme" qui doit être la valeur sélectionnée dans la liste.
    Cette variable change bien instantanément dans le champ texte "item_number", avec la fonction "showSelectedItem", mais impossible de la transformer instantanément en var somme.
    J'ai essayé toute la journée des dizaines de combinaison (et de forums), mais la seule valeur à chaque fois pour "somme" est celle du select au chargement de la page...
    J'imagine que cela doit être très simple, donc merci de ne pas se moquer , mais je bloque sérieusement.

    Merci pour toute aide.

  2. #2
    Expert confirmé
    Avatar de mathieu
    Profil pro
    Inscrit en
    Juin 2003
    Messages
    10 660
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Juin 2003
    Messages : 10 660
    Par défaut
    quand la valeur du menu déroulant est modifiée, il y a uniquement la fonction "showSelectedItem" qui est appelé.
    donc c'est seulement dans cette fonction que vous pouvez lire la nouvelle valeur. et cela fonctionne bien puisque le champ "item_number" récupère bien cette valeur.

    le reste du code est exécuté au lancement de la page, au moment où la valeur n'est pas encore modifiée.

  3. #3
    Membre actif
    Homme Profil pro
    Webmaster
    Inscrit en
    Janvier 2018
    Messages
    29
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Var (Provence Alpes Côte d'Azur)

    Informations professionnelles :
    Activité : Webmaster

    Informations forums :
    Inscription : Janvier 2018
    Messages : 29
    Par défaut Et oui, c'est bien ça le problème ;)
    Bonsoir et merci de la réponse.

    Oui, ça c'est ce que j'ai pu constater aussi...
    Mais comment puis-je faire pour que le résultat se trouvant dans ce champ texte puisse être transformer en variable utilisable hors de cette fonction?
    Ou bien utiliser la valeur "item" hors de la fonction, car le mot "somme" peut_être renomer en "item" sans problème.
    Et si je dois passer par ajax, je suis cuit parce que je n'y comprends rien du tout....

    Merci beaucoup pour l'aide, je continue à chercher .....

  4. #4
    Expert confirmé
    Avatar de mathieu
    Profil pro
    Inscrit en
    Juin 2003
    Messages
    10 660
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Juin 2003
    Messages : 10 660
    Par défaut
    l'AJAX permet une communication entre JavaScript côté client et le serveur, vous n'avez pas besoin de ça :
    https://javascript.developpez.com/fa...#ajax.acronyme

    si vous souhaitez utiliser la valeur modifiée, vous pouvez la passer à une fonction comme cela :

    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
     
    function showSelectedItem() {
        var item = document.getElementById("select").value;
     
        document.forms['liste'].elements['item_number'].value = item;
     
        traitementSomme(item);
     
    }
     
     
    function traitementSomme(somme) {
        // utiliser la valeur ici
        console.log(somme);
     
    }

  5. #5
    Membre actif
    Homme Profil pro
    Webmaster
    Inscrit en
    Janvier 2018
    Messages
    29
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Var (Provence Alpes Côte d'Azur)

    Informations professionnelles :
    Activité : Webmaster

    Informations forums :
    Inscription : Janvier 2018
    Messages : 29
    Par défaut
    Merci Mathieu pour l'aide,

    Mais cela ne fonctionne toujours pas...

    Il y a du mieux, j'ai bien la valeur qui s'affiche dans la console, mais n'est pas récupérable Hors de cette nouvelle fonction, même en essayant de faire:
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
     
    ......//début du code
     
    document.forms['liste'].elements['item_number'].value = item;
     traitementSomme(item);
    }
    function traitementSomme(somme) {
    // utiliser la valeur ici
    console.log(somme);// Ne fonctionne pas!
    var somme = console.log(somme);// Ne fonctionne pas!
     }
    console.log(somme);// Ne fonctionne pas!
    var somme = console.log(somme);// Ne fonctionne pas!
    Et si j'ai bien compris votre solution, il faudrait englober tout le code qui suit dans cette nouvelle fonction, mais là c'est Paypal qui ne fonctionne plus....
    Donc, si je comprends bien, en Javascript on ne peut pas déclarer une variable et l'utiliser comme on veut par la suite?

    Merci encore...

  6. #6
    Membre actif
    Homme Profil pro
    Webmaster
    Inscrit en
    Janvier 2018
    Messages
    29
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Var (Provence Alpes Côte d'Azur)

    Informations professionnelles :
    Activité : Webmaster

    Informations forums :
    Inscription : Janvier 2018
    Messages : 29
    Par défaut Le code en totalité pour mieux comprendre....
    Je place tout le code pour mieux comprendre, si cela peut aider.
    Code html : 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
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
    49
    50
    51
    52
    53
    54
    55
    56
    57
    58
    59
    60
    61
    62
    63
    64
    65
    66
    67
    68
    69
    70
    71
    72
    73
    74
    75
    76
    77
    78
    79
    80
    81
    82
    83
    84
    85
    86
    87
    88
    89
    90
    91
    92
    93
    94
    95
    96
    97
    98
    99
    100
    101
    102
    103
    104
    105
    106
    107
    108
    109
    110
    111
    112
    113
    114
    115
    116
    117
    118
    119
    120
    121
    122
    123
    124
    125
    126
    127
    128
    129
    130
    131
    132
    133
    134
    135
    136
    137
    138
    139
    140
    141
    142
    143
    144
    145
    146
    147
    <form action="" method="post" name="liste">
     
    <select name="size" id="select" style="width:100px" Onchange="javascript:SelectValueChamp();">
    <?php
    $nombre = 150;
    $est_divisible_par = 10;
    //echo "<select>";
    echo "<option selected value='' >Choisissez</option>";
    for ($x = 0; $x <= $nombre ; $x++) {   
    if($x % $est_divisible_par === 0)
    {
    //echo "The number is: $x <br>";
    if ($x != 0)  echo "<option value=$x.00 >$x</option>";
    }
    }
    echo "</select>";
    ?>
     
     
    <input type="text" name="item_number" value=""><br>
    <span id="current"></span>
     
    </form> 
    <div id="paypal-button"></div>
     
    <script>
    document.getElementById("current").innerHTML = "Choisissez le montant que vous souhaitez regler." ;
    var somme="1.00";
     
    function showSelectedItem() {
    //var somme="1.00";
    var item = document.getElementById("select").value;
    document.forms['liste'].elements['item_number'].value=item;
    traitementSomme(item);
        
    document.getElementById("current").innerHTML = "Vous avez choisi de regler " + item + " €" ;
    }
     
    function traitementSomme(somme) {
    // utiliser la valeur ici
    console.log(somme);
     }
     var somme = console.log(somme);
     
    document.getElementById("select").addEventListener("change", showSelectedItem);
     
     
     
        var CURRENCY = 'EUR';
        var SUBTOTAL =  somme;
        var TAX = '0.00';
        var SHIPPING = '0.00';
        var SHIPPING_DISCOUNT = '0.00';
        var TOTAL = somme;
     
          
        paypal.Button.render({
          env: 'sandbox', // Or 'sandbox',
     
          commit: true, // Show a 'Pay Now' button
     
    client: {
    sandbox: 'AMlXKb0P7rQnsdfgsdfgsdfgsdfgsdfgobGFnOt45U-RQB5ue9g69F9XF7bPaC6WiOUWVmGu738ZI9XrNWUvwFTisoZrn'
          },
     
          style: {
            label: 'paypal',
            size: 'small',
            shape: 'rect',
            color: 'blue'        
          },
     
          // Set up the payment here 
          payment: function (data, actions) {
            return actions.payment.create({
              payment: {
                transactions: [
                  {
                    amount: { 
                      total: TOTAL, 
                      currency: CURRENCY,
                      details: {
                        subtotal: SUBTOTAL,
                        tax: TAX,
                        shipping: SHIPPING,
                        shipping_discount: SHIPPING_DISCOUNT
                      }
                    },
                    //description: 'The payment transaction description',
                    description: 'Détail de votre transaction:',
                   // invoice_number: '48787589673',
                    item_list: {
                      items: [
        {name: 'Règlement partiel du site', quantity: '1', price: somme, currency: CURRENCY},
                      ]
                    }
                  }
                ],
        note_to_payer: 'Contactez moi pour toute question concernant ce règlement.'
              }
            });
          },
     
          // Execute the payment here 
          onAuthorize: function (data, actions) {
     
     
              return actions.payment.execute().then(function (payment) {
                // The payment is complete!
              
                // Get payer info            
                var payer = payment.payer.payer_info;
                console.log("Email: " + payer.email);
                console.log("Name: " + payer.first_name + ' ' + payer.last_name);
                
                // Get payment info
                console.log("Id: " + payment.id);
                console.log("Intent: " + payment.intent);
                console.log("State: " + payment.state);
                  
    document.location.href="http://www.mondomaine-approved.com?etat=";
                  
              });
     
            //});
          },
     
          onCancel: function (data, actions) {
            /* 
             * Buyer cancelled the payment 
             */
             console.log('Payment was cancelled!');
              //window.alert('Payment was cancelled!');
              document.location.href="http://www.mondomaine-cancelled.com";
          },
     
          onError: function (err) {
            /* 
             * An error occurred during the transaction 
             */
             console.log(err);
             window.alert('There was an error');
          }
        }, '#paypal-button');
        
       //showSelectedItem();
      </script>

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

Discussions similaires

  1. Réponses: 2
    Dernier message: 01/07/2016, 17h28
  2. variable javascript/ajax
    Par laxe13 dans le forum Général JavaScript
    Réponses: 1
    Dernier message: 05/08/2008, 09h46
  3. Réponses: 1
    Dernier message: 14/06/2006, 17h53
  4. Réponses: 5
    Dernier message: 14/06/2006, 16h35
  5. Passer la valeur dune variable javascript à une variable xsl
    Par nramariavelo dans le forum Général JavaScript
    Réponses: 6
    Dernier message: 12/12/2005, 17h27

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