Liste déroulantr
Fermé
aycha
-
21 août 2009 à 11:59
avion-f16 Messages postés 19250 Date d'inscription dimanche 17 février 2008 Statut Contributeur Dernière intervention 22 décembre 2024 - 22 août 2009 à 11:34
avion-f16 Messages postés 19250 Date d'inscription dimanche 17 février 2008 Statut Contributeur Dernière intervention 22 décembre 2024 - 22 août 2009 à 11:34
A voir également:
- Liste déroulantr
- Liste déroulante excel - Guide
- Liste déroulante en cascade - Guide
- Liste site streaming illégal - Accueil - Services en ligne
- Liste groupe whatsapp - Guide
- Liste de diffusion whatsapp - Guide
3 réponses
avion-f16
Messages postés
19250
Date d'inscription
dimanche 17 février 2008
Statut
Contributeur
Dernière intervention
22 décembre 2024
4 505
21 août 2009 à 12:32
21 août 2009 à 12:32
Orientes-toi vers de l'AJAX si tu as beaucoup de services.
Si tu n'as que 2-3 services, alors affiches toutes les données de tous les services mais masques-les. Ensuite, tu devra les afficher en Javascript.
Je te conseil ce tuto pour apprendre l'AJAX.
Pour la deuxième solution, voilà un script que je viens de pondre.
Si tu n'as que 2-3 services, alors affiches toutes les données de tous les services mais masques-les. Ensuite, tu devra les afficher en Javascript.
Je te conseil ce tuto pour apprendre l'AJAX.
Pour la deuxième solution, voilà un script que je viens de pondre.
avion-f16
Messages postés
19250
Date d'inscription
dimanche 17 février 2008
Statut
Contributeur
Dernière intervention
22 décembre 2024
4 505
22 août 2009 à 11:34
22 août 2009 à 11:34
Pour l'AJAX, c'est très simple. Créer une page services-ajax.php qui ne contient que du PHP.
Dans ta page HTML, place ce script entre <head> et </head>
Ton formulaire :
Pour finir, il te faut un div/p ayant comme id 'info-service'.
Si tu veux télécharger mon exemple : Télécharger
<?php // Fait les opérations nécessaire pour retourner la description du service demadné // (contenu dans $_POST['service'];) // Voici l'exemple que j'ai fais pour tester : if($_POST['service'] == 'html') { echo 'Nous développons pour vous un site Web totalement fonctionnel.<br/><a href="#">Plus d\'info</a>'; } elseif($_POST['service'] == 'css') { echo 'Nous pouvons réaliser votre design au prix le plus bas.<br/><a href="#">Plus d\'info</a>'; } elseif($_POST['service'] == 'php') { echo 'Nos développeurs peuvent créer un site Web intéractif avec espace d\'administration, système de news, ... ou une application Web.<br/><a href="#">Plus d\'info</a>'; } elseif($_POST['service'] == '--') { echo ''; } else { echo 'error'; } ?>
Dans ta page HTML, place ce script entre <head> et </head>
<script type="text/javascript"> function afficherService() { var service = document.getElementById('service').value; var xhr = null; if (window.XMLHttpRequest || window.ActiveXObject) { if (window.ActiveXObject) { try { xhr = new ActiveXObject("Msxml2.XMLHTTP"); } catch(e) { xhr = new ActiveXObject("Microsoft.XMLHTTP"); } } else { xhr = new XMLHttpRequest(); } } else { alert("Votre navigateur ne supporte pas l'objet XMLHTTPRequest..."); return; } xhr.onreadystatechange = function() { if (xhr.readyState == 4 && (xhr.status == 200 || xhr.status == 0)) { document.getElementById('info-service').innerHTML = xhr.responseText; } }; xhr.open("POST", "services-ajax.php", true); xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded") xhr.send("service=" + service); return false; } </script>
Ton formulaire :
<form method="post" action="" onsubmit="return afficherService();"> <fieldset> <legend>Nos services</legend> <p> <label for="service">Service :</label> <select name="service" id="service" onchange="afficherService();"> <!-- Le contenu de la liste, peut-être généré par PHP --> <option value="--">--</option> <option value="html">HTML</option> <option value="css">CSS</option> <option value="php">PHP</option> </select> </p> <p> <input type="submit" value="Plus d'info" /> </p> </fieldset> </form> <!-- Tu peux le personnalisé comme tu veux mais laisse le onchange sur select, onsubmit sur form, et l'id sur le select -->
Pour finir, il te faut un div/p ayant comme id 'info-service'.
Si tu veux télécharger mon exemple : Télécharger
21 août 2009 à 12:53
Je vais essayer ta proposition, si j'ai un problème je vais te conacter.