AJAX:formulaire avec liste déroulante dynamique

AJAX:formulaire avec liste déroulante dynamique - HTML/CSS - Programmation

Marsh Posté le 20-04-2007 à 15:26:57    

bonjour a tous,
voila j'ai une page contenant une liste déroulante. Cette liste possede 3 option: "Renault", "Peugeot", "Citroen". Lorsque je clique sur renault ,ca m'affiche une autre liste déroulante, contenant "Clio" et "Laguna", et lorsque je clique sur peugeot, ca m'affiche "205" et "607"...
 
Ca marche bien, seulement j'aimerais utiliser la valeur contenu dans la 2eme liste déroulante (205 ,clio par exemple). Donc j'utilise un formulaire. Et a ce moment là, kan je clique sur la marque de la voiture (renault) ,j'obtient un message d'erreur de firebug:
>>action is not a function.
 
Sans formulaire, ca veut bien m'afficher la 2eme liste, et dans un formulaire ca ne marche plus :(
Savez vous d'ou vient cette erreur svp ?
 
Voici mon script contenant le formulaire:

Code :
  1. <html>
  2. <head>
  3.    <title>Page de test 1 Ajax</title>
  4.  <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
  5. </head>
  6. <body>
  7.  <script type="text/javascript">
  8.   var objRequete = new XMLHttpRequest();
  10.   function action() {
  11.    // fonction appelée. param non utilisée ici
  12.     //var ma_variable=document.getElementById("..." ).value;
  14.     objRequete.open('get','traite2.php?select1='+document.getElementById("Sel1" ).value,true);
  15.     objRequete.onreadystatechange = fonction_Retour_Reponse;
  16.     objRequete.send(null);                     // envoie de la requete
  17.     return true; // la fonction retourne vrai (sans incidence ici - syntaxiquement correct)
  18.    }
  20.   function fonction_Retour_Reponse() {
  21.     if (objRequete.readyState==4) {
  22.       //alert(objRequete.responseText);
  23.                               document.getElementById("zonetext" ).innerHTML=objRequete.responseText;
  24.     }
  25.   }
  27.  </script>
  28. <FORM id="idForm6" method="POST">
  30.     <select name="select1" id="Sel1" onChange="action();">
  31.         <option value="0">renault</option>
  32.         <option value="1">peugeot</option>
  33.         <option value="2">citroen</option>
  34.     </select>
  35.  <p id="zonetext">
  36.         </p>
  37. <INPUT type="submit" value="Executer" name="ok">
  38. </FORM>
  39. <?php
  40. if (isset($_POST['voiture'])) {
  41.  echo "OK";
  42. }
  43. ?>
  44. </body>
  45. </html>


 
et voici le traitement php:
 

Code :
  1. <?php
  2. $renault=array("clio","laguna" );
  3. $peugeot=array("205","607" );
  4. $citroen=array("ax","bx" );
  6. if ($_REQUEST["select1"] == "0" ) {
  8. print("<SELECT NAME =\"voiture\">" ); //indication du nom de la variable qui sera envoyée
  9.       for($i=0;$i<sizeof($renault);$i++)
  10.        {
  11.            print("<OPTION VALUE = ".$renault[$i]."> ".$renault[$i]);
  12.           }
  13.          print("</SELECT>" );
  14. }
  15.  elseif ($_REQUEST["select1"] == 1) {
  17. print("<SELECT NAME =\"voiture\">" ); //indication du nom de la variable qui sera envoyée
  18.       for($i=0;$i<sizeof($peugeot);$i++)
  19.        {
  20.            print("<OPTION VALUE = ".$peugeot[$i]."> ".$peugeot[$i]);
  21.           }
  22.          print("</SELECT>" );
  23. }
  24. elseif ($_REQUEST["select1"] == 2) {
  26. print("<SELECT NAME =\"voiture\">" ); //indication du nom de la variable qui sera envoyée
  27.       for($i=0;$i<sizeof($citroen);$i++)
  28.        {
  29.            print("<OPTION VALUE = ".$citroen[$i]."> ".$citroen[$i]);
  30.           }
  31.          print("</SELECT>" );
  32. }
  33. ?>

Reply

Marsh Posté le 20-04-2007 à 15:26:57   

Reply

Sujets relatifs:

Leave a Replay

Make sure you enter the(*)required information where indicate.HTML code is not allowed