|
Posté le 20/09/2012 @ 22:29 |
Petit astucien
| Bonjour,
J'ai une petite liste deroulante. Dont j'utilise la variable de sortie $id_select qui prends la valeur choisi par l'utilisateur.
Seulement j'aimerai que cette variable prenne la bonne valeur des le choix de l'usager et pas besoin de recharger une page.
<tr> <td>1.</td> <td><select name="couleurs_pant_1"> <option value="0">-------------</option> <option value="1">Noir</option> <option value="2">Blanc</option> </select></td> <td><select name="taille_pant_1"> <option value="0">------------</option> <option value="1">XS</option> <option value="2">S</option> <option value="3">M</option> <option value="4">L</option> <option value="5">XL</option> <option value="6">2XL</option> <option value="7">3XL</option> </select></td> <td><select name="quantite_pant_1"> <option value="0">------------</option> <option value="1">1</option> <option value="2">2</option> <option value="3">3</option> <option value="4">4</option> <option value="5">5</option> <option value="6">6</option> <option value="7">7</option> </select></td> <td><? echo 330*$quantite_pant_1; ?></td> </tr>
Pour l'instant cela ne fonctionne pas :(
|
|
|
|
|
|
Posté le 21/09/2012 à 08:37 |
| Salut,
C'est tout à fait normal, PHP est exécuter du coté serveur, pas du coté client donc il ne peut pas récupérer la valeur dans ton select.
La meilleure moyen a faire c'est de soit faire un script en Javascript (avec jQuery pour plus de facilité ) ou soit faire un script en Ajax.
Voici un exemple de script avec jQuery
<html> <head> <script type="text/javascript" src="http://code.jquery.com/jquery-1.8.2.min.js"></script> <script> $(function() { $("select#qte_pant_1").change(function(){ a = $('option:selected', this).val(); $("td#affiche").text(a); }); }); </script> </head> <body> <table> <tr> <td>1.</td> <td> <select name="couleurs_pant_1"> <option value="0">-------------</option> <option value="1">Noir</option> <option value="2">Blanc</option> </select> </td> <td> <select name="taille_pant_1"> <option value="0">------------</option> <option value="1">XS</option> <option value="2">S</option> <option value="3">M</option> <option value="4">L</option> <option value="5">XL</option> <option value="6">2XL</option> <option value="7">3XL</option> </select> </td> <td> <select id="qte_pant_1" name="quantite_pant_1"> <option value="0">------------</option> <option value="1">1</option> <option value="2">2</option> <option value="3">3</option> <option value="4">4</option> <option value="5">5</option> <option value="6">6</option> <option value="7">7</option> </select> </td> <td id="affiche"> </td> </tr> </table> </body> </html>
Modifié par micron le 21/09/2012 11:50 |
|
Posté le 25/09/2012 à 18:47 |
Petit astucien
| Merci Micron !
Je regarde ca |
|
Posté le 25/09/2012 à 20:06 |
Petit astucien
| Micron,
Ta solution marche parfaitement !! :)
Sauf que j'arrive pas a la dédoubler :(
Lorsque j'essai de le double comme suit, la premiere marche bien, mais la deuxieme, ne marche pas; il m'affiche constament 0.
Je te met le lien, comme ca tu pourra avoir l'exemple concret de ce que j'ai fait :)
http://www.mvdracewear.fr/test/Shop/index.php Modifié par 007good le 25/09/2012 20:06 |
|
Posté le 25/09/2012 à 20:15 |
Petit astucien
| Je n'ai toucher qu'au deux premier select ;) |
|
Posté le 25/09/2012 à 21:19 |
| J'ai trouvé pourquoi
Le problème c'est dans ton select 2
<select id="qte_pant_2" name="quantite_pant_2"> <option value="">------------</option> <option value="">1</option> <option value="">2</option> <option value="">3</option> <option value="">4</option> <option value="">5</option> <option value="">6</option> <option value="">7</option> </select>
Comme tu peux le voir, chaque option à une value vide. Il faut mettre une valeur comme t'as fais pour le select qte_pant_1 ;)
Sinon, pour ton code js c'est mieux de faire ceci :
<script> $(function() { $("select#qte_pant_1").change(function(){ pant_1 = $('option:selected', this).val()*330;
$("td#affiche_pant_1").text(pant_1); });
$("select#qte_pant_2").change(function(){
pant_2 = $('option:selected', this).val()*330;
$("td#affiche_pant_2").text(pant_2); });
});
</script>
mais, il a moyen de faire encore plus court que ca, je vais essayer de le faire Modifié par micron le 25/09/2012 21:28 |
|
Posté le 25/09/2012 à 22:06 |
Petit astucien
| Arf, tu as complétement raison. J'avais mis tout "à vide" au début, et même pas fait attention à cela.
Un grand merci pour ton aide précieuse |
|
Posté le 25/09/2012 à 22:17 |
| Mais de rien
En tout cas j'ai trouvé le moyen de réduire la fonction.
Mais je me demande juste si le 330 est une valeur fixe ou variable ? |
|
Posté le 25/09/2012 à 22:34 |
Petit astucien
| |
|
Posté le 26/09/2012 à 07:13 |
| ok et bin si c'est fixe, voici alors le script
<html> <head> <script type="text/javascript" src="http://code.jquery.com/jquery-1.8.2.min.js"></script> <script> $(function() { $("select.qte").change(function(){ a = $('option:selected', this).val()*330; id = $(this).attr("id"); $("td#affiche_"+id).text(a); }); }); </script> </head> <body> <table> <tr> <td>1.</td> <td> <select name="couleurs_pant_1"> <option value="0">-------------</option> <option value="1">Noir</option> <option value="2">Blanc</option> </select> </td> <td> <select name="taille_pant_1"> <option value="0">------------</option> <option value="1">XS</option> <option value="2">S</option> <option value="3">M</option> <option value="4">L</option> <option value="5">XL</option> <option value="6">2XL</option> <option value="7">3XL</option> </select> </td> <td> <select class="qte" id="qte_pant_1" name="quantite_pant_1"> <option value="0">------------</option> <option value="1">1</option> <option value="2">2</option> <option value="3">3</option> <option value="4">4</option> <option value="5">5</option> <option value="6">6</option> <option value="7">7</option> </select> </td> <td id="affiche_qte_pant_1"> </td> </tr> <tr> <td>2.</td> <td> <select name="couleurs"> <option value="">-------------</option> <option value="">Noir</option> <option value="">Blanc</option> <option value="">Rouge</option> <option value="">Vert</option> <option value="">Bleu</option> <option value="">Jaune</option> <option value="">Multicouleur Blanc</option> <option value="">Multicouleur Noir</option> </select> </td> <td> <select name="taille"> <option value="">------------</option> <option value="">XS</option> <option value="">S</option> <option value="">M</option> <option value="">L</option> <option value="">XL</option> <option value="">2XL</option> <option value="">3XL</option> </select> </td> <td> <select class="qte" id="qte_pant_2" name="quantite_pant_2"> <option value="0">------------</option> <option value="1">1</option> <option value="2">2</option> <option value="3">3</option> <option value="4">4</option> <option value="5">5</option> <option value="6">6</option> <option value="7">7</option> </select> </td> <td id="affiche_qte_pant_2"> </td> </tr> </table> </body> </html>
|
|