PHP/Javascipt et formulaire dynamique

Bonjour,
je suis entrain de monter une page PHP avec un formulaire qui contient, entre autre, une liste de départements (requête PHP/MySQL).
Je souhaiterais pouvoir afficher une liste des villes du département une fois celui-ci sélectionné mais sans avoir à recharger complètement le formulaire.
En cherchant par-ci par-la, j'ai trouvé 1 technique utilisant XMLHttpRequest(); et innerHTML mais il semble (http://www.siteduzero.com/tutoriel-3-4552-le-dom.html) que cette technique ne respecte pas les standards du web et soit IE propriétaire...
Il est expliqué dans ce site une autre méthode pour afficher du texte utilisant appendChild.
Cependant, je ne vois pas comment rendre cela interactif!
En effet, ce qui est ajouté par le appendChild est prévu et ne permet pas (il me semble) d'inclure une requête PHP.
Quelqu'un pourrait-il m'aider?!!
Merci
Renan

Bonjour,

>>1 technique utilisant XMLHttpRequest();
ajax pour les intimes

>>et innerHTML mais il semble que cette technique
>>ne respecte pas les standards du web
>>et soit IE propriétaire...
ajax et innerHTML ne sont pas exclusif IE
et en quoi ne respecteraient-il pas les
soit-disant standards du web ?

>>une autre méthode pour afficher du texte utilisant appendChild.
oui, on peut aussi. createElement + appendChild
c'est un peu "plus compliqué", enfin, si on peut dire,
mais innerHTML risque de dégrader les performances
si de nombreux ajouts consécutifs sont faits

>>je ne vois pas comment rendre cela interactif!
je ne comprend pas bien la question ?
rien à changer sauf remplacer l'affichage
du résultat de ajax.

pour l'instant, cela doit renvoyer du html
à afficher directement ( je ne dis pas que
ce n'est pas bien, mais ajax est fait pour
retourner des informations qui seront traitées
par le javascript, pas du html ) renvoyez
les données en php nécessaires à la construction
par createElement+appendChild

>>appendChild est prévu et ne permet pas
>>d'inclure une requête PHP.
ça ne veut rien dire ça
appendChild ajoute des éléments
une requête php n'a rien à voir
la réponse du php, par contre, devrait retourner
des données pour que le javascript les traite
et pourquoi pas fasse des appendChild

un exemple de select liées ici
on construit le 2ème select non pas avec innerHTML
mais en utilisant select.length, select.options[index].text...
qu'on peut remplacer par createElement+appendChild
( si on y tient, pour le plaisir )

Cordialement [mon Site] [M'écrire] Bul

Bonjour,
merci pour cette réponse!
J'ai passé un peu de temps à décortiquer tes exemples, et j'ai toujours quelques problèmes:
- la méthode "PHP pure" nécessite, si j'ai bien compris, de recharger la page pour mettre à jour le 2° select, ce qui est ennuyeux dans le cas d'un formulaire à plusieurs champs. Je me suis donc penché sur la méthode java...
- j'ai suivi, il me semble, les instructions et honteusement copié... mais cela ne marche toujours pas.
Le fichier correspondant au 2° select (ajax1.php) fonctionne lorsque je l'appelle directement dans le navigateur:

<?php require_once('../../Connections/bd.php'); ?>

<?php

   header('Content-type:text/html;charset=ISO-8859-1');

      //Liste des villes du département

mysql_select_db($database_bd1, $bd1);

$code='WHERE dpt_ville="' . $_GET["tb2"] . ' " ';

$query_ville1 = "SELECT * FROM mdm_ville_cat " . $code . "ORDER BY nom_ville"  ;

$ville1 = mysql_query($query_ville1, $bd1) or die(mysql_error());

$row_ville1 = mysql_fetch_assoc($ville1);

$totalRows_ville1 = mysql_num_rows($ville1);

$t="";

   for ($nb=0;$nb<$totalRows_ville1;$nb++)

   {  

   $i=mysql_result($ville1,$nb,"id_ville");

      $t.="\t".$i;   

   }	 

   echo $t;

?>

<?php

//Liste des departements

mysql_select_db($database_bd1, $bd1);

$query_departement1 = "SELECT * FROM mdm_departement_cat ORDER BY nom_dpt ASC";

$departement1 = mysql_query($query_departement1, $bd1) or die(mysql_error());

$row_departement1 = mysql_fetch_assoc($departement1);

$totalRows_departement1 = mysql_num_rows($departement1);

?>

<select name="tb1" id="tb1" size=3 onchange='appel();'>

<?php

   for ($nb=0;$nb<$totalRows_departement1;$nb++)

   {  $i=mysql_result($departement1,$nb,"id_dpt");

   		$j=mysql_result($departement1,$nb,"nom_dpt");

      echo '<option value="' . $i . '">'.$j.'</option>';   

	}

?></select>

      <select name="tb2" id="tb2" size=3></select>  

<script type="text/javascript">

function xmlhttp()

   {  var x;

      try         {  x = new ActiveXObject("Microsoft.XMLHTTP");   }

      catch (e)   {  try         {   x = new ActiveXObject("Msxml2.XMLHTTP");   }

                     catch (e)   {   try         {   x = new XMLHttpRequest();   }

                                     catch (e)   {   x=false;   }

                                 }

                  }

      return x;

   }

function appel()

   {   var xml = xmlhttp();

      if(!xml)

             {   alert("XmlHttpRequest non supporté");   }

      else   {   xml.onreadystatechange = function()

                 {   if(xml.readyState==4)

                     {   var opt=xml.responseText.split("\t");

                         tb2.length=0;

                         for ( var n=1;n<opt.length;n++ )

                         {   tb2.length++;

                             tb2.options[tb2.length-1].text=opt[n];

                         }

                     }

                  }

                  xml.open("GET", "./javascript/ajax1.php?tb2="+tb1.options[tb1.selectedIndex].text, true);

                  xml.send(null);

             }

   }      

</script>

J'ai installé FireBug! c'est vraiment très utile!! Merci!
Mais malheureusement, je ne comprends rien au Javascript...
Pourrais-tu me dire ce qui cloche quand on a :

tb1 is not defined
xml.open("GET", "./jav...options[tb1.selectedIndex].text, true);\n

pourtant la table est définie juste après le script, cf le code collé au dessus!
Merci!

>> xml.open("GET", "./javascript/ajax1.php?tb2="+tb1.options[tb1.selectedIndex].text, true);

tel que c'est fait là, ça appelle le php
"./javascript/ajax1.php"
( donc dans le répertoire où l'on est, dans
le sous-répertoire "javascript", le php "ajax1.php" )

tb1, c'est le "1er" select
qui donc doit être de la forme <select name="tb1" id="tb1" ...>
ce serait mieux, d'ailleurs, de faire

>>pourtant la table est définie juste après le script,
ah... vous avez oublié que le html/javascript,php...
sont des langages interprétées ?
les lignes sont exécutées dans l'ordre où elles
se présentent !
donc cet ordre doit être donné après le select

>>je ne comprends rien au Javascript...
ben.... si vous voulez utiliser, il faudrait
vous y mettre ! non ?
entre nous, le javascript est toujours facultatif,
on peut toujours s'en passer, pourquoi vouloir
utiliser si on ne connait pas ?