Afficher js dans une div

a marqué ce sujet comme résolu.

Bonjour à tous !

J’ai un site de boutique sur lequel je propose une option pour ajouter le logo du club de foot sur les maillots. Via deux boutons radio avec comme choix "oui" et "non", les gens peuvent choisir si oui ou non ils veulent le logo du club. S’ils cochent oui, le prix d’un maillot passe par exemple de 20 à 25€ (prix du logo étant de 5€ donc). S’il recoche non, le prix revient à 20€.

J’ai essayé plusieurs façon mais ça marche dans certains cas sauf le mien. Je vous montre le code que j’ai actuellement rédigé car le javascript et moi, ça ne fait pas tout à fait 1 :pirate:

Les boutons radio :

1
2
<td><input type= "radio" name="image" value="non" id="imagenon" checked><label for="imagenon">non</label>
  <input type= "radio" name="image" value="oui" id="imageoui"><label for="imageoui">oui</label></td>

La ligne avec la div là ou je souhaite afficher le contenu de ma variable dans le JS :

1
<div id='bout_prod_prix_case'><?php $prixLogo = '<div name="ajoutPrix"></div>'; $prixVente = $produit->getPrixVente();  echo number_format($produit->getPrixVente()+0,2,'.',' ')." &euro;"; echo $prixLogo; ?></div>

Ne faites pas attention au bordel, c’est à cause de tous mes tests x)

Et le code JS :

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
<script>
var radioimage = document.getElementsByName('image');
for (var i = radioimage.length - 1; i >= 0; i--) {
  radioimage[i].onchange = function(){
    var choix = this.value;
    console.log(choix);
  }
};
if($('#imageoui').is(':checked'))
{
 document.getElementsByName('ajoutPrix').innerHTML = '+5';
}
else if(document.getElementById('imagenon').checked)
{
 document.getElementsByName('ajoutPrix') = '-5';
}
</script>
+0 -0

En effet, j’ai changé le JS par ça :

 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
<script>
var radioimage = document.getElementsByName('image');
for (var i = radioimage.length - 1; i >= 0; i--) {
  radioimage[i].onchange = function(){
    var choix = this.value;
    console.log(choix);
  }
};

function check(){
var inputs = document.getElementsByTagName('input'),
    inputsLength = inputs.length;

  //document.getElementById('ajoutPrix').innerHTML = 'heelo';
  for (var i = 0; i < inputsLength; i++){
    if(inputs[i].type === 'radio' && inputs[i].checked)
    {
     document.getElementById('ajoutPrix').innerHTML = 5;
    }
    else if(document.getElementById('imagenon').checked)
    {
     document.getElementsById('ajoutPrix').innerHTML = 'test';
    }
  }
}
</script>

Et ça marche pour ajouter 5, sauf que ça n’additionne pas avec ma variable php et j’aimerais savoir quoi mettre pour que le else fonctionne dans mon JS :(

+0 -0

Dois-je remplacer 

1
if(inputs[i].type === 'radio' && inputs[i].checked)

par 

1
if(inputs[i].type === 'radio' && document.getElementById('imageoui').checked)

? :euh:

EDIT : J’ai corrigé à ça :

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
function check(){
var inputs = document.getElementsByTagName('input'),
    inputsLength = inputs.length;

  //document.getElementById('ajoutPrix').innerHTML = 'heelo';
  for (var i = 0; i < inputsLength; i++){
    if(inputs[i].type === 'radio' && inputs[i].checked)
    {
     document.getElementById('ajoutPrix').innerHTML = inputs[i].value;
    }
  }
}

qui marche et pas besoin de Else. Cependant il me reste le problème de faire en sorte que si l’on clique sur oui, le maillot à 16€ passe à 21€, car là il ne prend pas en compte l’addition en php :(

+0 -0
Connectez-vous pour pouvoir poster un message.
Connexion

Pas encore membre ?

Créez un compte en une minute pour profiter pleinement de toutes les fonctionnalités de Zeste de Savoir. Ici, tout est gratuit et sans publicité.
Créer un compte