rafraichissement d'un sélect

rafraichissement d'un sélect - PHP - Programmation

Marsh Posté le 16-02-2008 à 13:56:44    

Bonjour,
 
J'ai deux sélect qui fonctionnent ensemble, c'est-à-dire que le 2e dépend du choix effectué au premier sélect. Ça fonctionne plus ou moins bien à date.
 
1) quand je clique sur ok, le premier sélect (type) se réinitialise; je voudrais conserver le choix de l'usager  
 
2) Quand je fais un choix dans le premier sélect (type), je voudrais que le 2e sélect (an) soit mis à jour sans cliquer sur ok.
 
Voici le code des mes deux sélect.
 
Merci!
 

Code :
  1. // Sélection du statut
  2. echo '<tr>';
  3. echo '<th width="20%" align="right" height="35">Liste</th>';
  4. echo '<td>';
  5.  $type=$_POST['type'];
  6.  require("../../config.inc.php" );
  7.  $r_type = "SELECT distinct(type),TB_statut.description FROM `ATS_statut`
  8.       left join TB_statut on ATS_statut.type=TB_statut.code order by TB_statut.description";
  9.  $res = mysql_query($r_type);
  10.  echo '<select name="type">';
  11.  while($val=mysql_fetch_array($res)) {
  12.   echo "<option value=".$val["type"].">".$val["description"]."</option>\n";
  13.   if($type == $val["type"]) {echo ' selected="selected"';}
  14.  }
  15.  echo '</select>';
  16.  echo $type;
  17. echo '</td>';
  18. echo '</tr>';
  20. // Sélection de l'année
  21. echo '<tr>';
  22. echo '<th align="right" height="35">Année</th>';
  23. echo '<td>';
  24.  $r_an="SELECT distinct(an) FROM `ATS_statut` WHERE type='$type' order by an";
  25.  $res = mysql_query($r_an);
  26.  echo '<select name="an">';
  27.  while($val=mysql_fetch_array($res)) {
  28.   echo "<option value=>".$val["an"]."</option>\n";
  29.   if($an == $val["an"]) {echo ' selected="selected"';}
  30.  }
  31.  echo '</select>';
  32.  echo $an;
  33. echo '</td>';
  34. echo '</tr>';

Message cité 1 fois
Reply

Marsh Posté le 16-02-2008 à 13:56:44   

Reply

Marsh Posté le 16-02-2008 à 14:24:40    

fourniey a écrit :

Bonjour,
 
J'ai deux sélect qui fonctionnent ensemble, c'est-à-dire que le 2e dépend du choix effectué au premier sélect. Ça fonctionne plus ou moins bien à date.
 
1) quand je clique sur ok, le premier sélect (type) se réinitialise; je voudrais conserver le choix de l'usager  


 
quand tu veux selectionner une valeur par defaut d'un select il faut utiliser l'atribut selected="selected"
http://www.w3schools.com/html/tryi [...] ml_select3
http://www.w3schools.com/html/html_forms.asp
 
oupsss, j'avais pas vu que tu as eu l'idée de faire ceci. Tu as bien commencé mais tu t'es trompé dans la syntaxe. L'atribut selected="selected" est dans la balise option. <option select="selected">toto</option>
 
 

Citation :

2) Quand je fais un choix dans le premier sélect (type), je voudrais que le 2e sélect (an) soit mis à jour sans cliquer sur ok.


plusieurs possibilité pour faire ceci :
- passer par de l'ajax
Au moment ou tu selectionne ton premier select, tu appelles une fonction JS avec l'événement onChange  
- qui créé le 2ème select en DOM
- qui fait un submit (rafraichissement de toute la page)

Reply

Marsh Posté le 16-02-2008 à 14:53:54    

J'ai changé le selected et j'obtiens une erreur.
 

Code :
  1. echo '<select name="type">';
  2.  while($val=mysql_fetch_array($res)) {
  4.  $selected="";
  5.   if($type == $val["type"]) {
  6.    $selected=" selected=\"selected\"";
  7.   }
  8.   echo '<option value='.$val["type"].$selected.'>'.$val["description"] '</option>\n';
  9.  }
  10.  echo '</select>';


Message édité par fourniey le 16-02-2008 à 15:09:22
Reply

Marsh Posté le 16-02-2008 à 15:16:38    

De cette façon, mon premier sélect est ok.
 
   $selected="";
   if($type == $val["type"]) {$selected=" selected=\"selected\"";}  
   echo '<option value='.$val["type"].$selected.'>'.$val["description"].'</option>\n';

Reply

Marsh Posté le 17-02-2008 à 14:50:51    

voila très bien en effet ...
 
Apres, utilises l'évenement onChange sur ton 1er select :
 
echo '<select name="type" onChange="fsubmit()" >';
 
et créé toi une fonction JS ou tu submit ton formulaire (par exemple) :

<script>
function fsubmit ()
{
//tu submit ton formulaire
 
}
</script>


Message édité par weed le 17-02-2008 à 14:51:23
Reply

Marsh Posté le 17-02-2008 à 15:20:16    

je ne suis pas assez famillier pour faire cela.
 
Je suis entrain d'étudier les listes déroulantes liées entre elles en ajax pour voir ce que je peux faire.

Message cité 1 fois
Reply

Marsh Posté le 17-02-2008 à 20:56:30    

fourniey a écrit :

je ne suis pas assez famillier pour faire cela.
 
Je suis entrain d'étudier les listes déroulantes liées entre elles en ajax pour voir ce que je peux faire.


 
Idéallement c'est bien sur de le faire en Ajax mais seulement dans un premier temps pour te simplifier la tache, il te suffit de submiter la page des qu'il y a un changement lorsque tu change ton premier select.
 
Donc pour reprendre mon exemple, dans la fonction select, tu fais un truc du genre :
 

<script>
function fsubmit ()
{
document.monformulaire.submit();
 
}
</script>


 
et par contre il te faut bien nommer ton formulaire par "monformulaire"
 
 

<form name="monformulaire">
 
//Tu mets tes selects entre les balises form
 
</form>


Message édité par weed le 17-02-2008 à 20:59:02
Reply

Marsh Posté le 17-02-2008 à 21:00:52    

Je suis tout mêlé et ça ne fonctionne pas vraiment.

Code :
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml">
  3. <head>
  4.  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  5.  <title>ATS-Liste</title>
  6.  <link href="http://www.ats3r.org/ats.css" rel="stylesheet" media="screen">
  7. </head>
  9. <body>
  10.  <div class="conteneur">
  11.  <div class="header"><p class="top"><a href="http://www.ats3r.org"><img src="../../site/images/accueil.gif" border="0" alt="Accueil"></img></a></p></div>
  12.  <div class="frame">
  13.  <?php
  14.   echo '<br><br><br><br><br><br><br><br>';
  16.   echo '<table align="center" border="15" bgcolor="#AC9F8C" width="40%">';
  17.   echo '<tr>';
  18.   echo '<th colspan="2"><h2>Liste disponible</h2></th>';
  19.   echo '</tr>';
  21.   // Sélection du statut
  22.   echo '<tr>';
  23.   echo '<th width="20%" align="right" height="35" cellpadding="5">Liste</th>';
  24.   echo '<td>';
  25.    $liste=$_POST['liste'];
  26.    require("../../config.inc.php" );
  27.    $requete1="SELECT distinct(type),TB_statut.description FROM `ATS_statut`
  28.         left join TB_statut on ATS_statut.type=TB_statut.code order by TB_statut.description";
  29.    $resultat1=mysql_query($requete1) or die ("Exécution de la requête impossible" );
  30.    echo '<form method="POST" action="">';
  31.    echo '<select name="liste" onchange="this.form.submit();">';
  32.    echo '<option></option>';
  33.     while($val=mysql_fetch_array($resultat1)) {
  34.      $selected="";
  35.      if($liste == $val["type"]) {$selected=" selected=\"selected\"";}
  36.       echo '<option value='.$val["type"].$selected.'>'.$val["description"].'</option>\n';
  37.     }
  38.     echo "</select>\n";
  39.    echo "</form>";
  40.  echo '</td></tr>';
  42.  echo '<form method="GET" action="l_voir.php">';
  44.  if (isset($_POST['liste'])) {
  45.   require("../../config.inc.php" );
  46.   $requete2="SELECT distinct(an) FROM `ATS_statut` WHERE type='$liste' order by an"; 
  47.   $resultat2=mysql_query($requete2) or die ("Exécution de la requête impossible" );
  48.  }
  49.  echo '<th align="right" height="35">Année</th>';
  50.  //Création d'un formulaire contentant une liste de sélection
  51.  echo '<td>';
  52.  echo '<select name="an">';
  53.   while($val=mysql_fetch_array($resultat2)) {
  54.    echo "<option value=>".$val["an"]."</option>\n";
  55.   }
  56.   echo "</select>\n";
  57.  echo '</td></tr>';
  59.  echo '<tr>';
  60.  echo '<th align="right" height="35">Type</th>';
  61.  echo '<td>';
  62.  echo '<select name="type">';
  63.  echo '<option value="liste_tel">Liste téléphonique</option>';
  64.  echo '<option value="Liste_adr">Liste d\'adresse</option>';
  65.  echo '</select>';
  66.  echo '</td>';
  67.  echo '</tr>';
  70.  echo '<tr>';
  72.  echo '<td colspan="2" align="center" height="40">';
  76.     //echo '<input type="hidden" name="liste" value='.$liste.'>';
  77.  //echo '<input type="hidden" name="annee" value='.$an.'>';
  78.  //echo '<input type="hidden" name="type" value='.$type.'>';  
  79.  echo '<input type="submit" value="Visualiser la liste"></td>';
  81.  echo '</tr>';
  82.  echo '</form>';
  86. echo '</table>';
  88. echo '</div>';
  89. echo '<div class="footer"></div>';
  90. echo '</div>';
  91. echo '</tr>';
  94. ?>
  95. </body>
  96. </html


Message édité par fourniey le 17-02-2008 à 21:01:22
Reply

Marsh Posté le 17-02-2008 à 21:17:19    

fourniey, tu n'as pas voulu m'ecouter et en faire qu'a ta tete ^^, je te conseillé de passer par une fonction javascript pour etre sur de la syntaxe et tu t'es planté :)
 
echo '<select name="liste" onchange="this.form.submit();">';
 
à remplacer par :
 
echo '<select name="liste" onChange="javascript:this.form.submit();" >';
 
J'ai trouvé ton erreur en faisant une recherche google sur l'expression : this.form.submit
Regarde le 2ème lien comme exemple :
http://www.google.fr/search?client [...] che+Google
 
essaie cela. Maintenant les valeurs doivent etre envoyé lorsque tu fais un changement de ton premier select ...

Reply

Marsh Posté le 17-02-2008 à 21:22:52    

Ben non, je ne connais pas le javascript. Pour ça, je l'évite.
 
Le select de liste fonctionne très bien.


Message édité par fourniey le 17-02-2008 à 21:24:23
Reply

Marsh Posté le 17-02-2008 à 21:22:52   

Reply

Marsh Posté le 17-02-2008 à 21:40:18    

Au départ, j'ai essayé de le faire AJAX mais je n'y arrivais pas alors, j'ai essayé autre chose.
 
cette ligne n'Est pas exécutée: <select size="1" name="type" OnChange="sendData('id='+this.value,'lire_an.php')" onKeyUp="sendData('id='+this.value,'lire_an.php')">
 
 

Code :
  1. <html xmlns="http://www.w3.org/1999/xhtml">
  2. <head>
  3. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  4. <title>ATS-Liste</title>
  5. <link href="http://www.ats3r.org/ats.css" rel="stylesheet" media="screen">
  7. <script type="text/javascript">
  8.  /** Permet d'envoyer des données en GET ou POST en utilisant les XmlHttpRequest */
  9.  function sendData(param, page)
  10.  {
  11.   if(document.all)
  12.   {
  13.    //Internet Explorer
  14.    var XhrObj = new ActiveXObject("Microsoft.XMLHTTP" ) ;
  15.   }//fin if
  16.   else
  17.   {
  18.       //Mozilla
  19.    var XhrObj = new XMLHttpRequest();
  20.   }//fin else
  22.   //définition de l'endroit d'affichage:
  23.   var content = document.getElementById("contenu" );
  24.   XhrObj.open("POST", page);
  25.   //Ok pour la page cible
  26.   XhrObj.onreadystatechange = function()
  27.   {
  28.    if (XhrObj.readyState == 4 && XhrObj.status == 200)
  29.     content.innerHTML = XhrObj.responseText ;
  30.   }
  31.   XhrObj.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
  32.   XhrObj.send(param);
  33.  }
  34.  //fin fonction SendData
  35. </script>
  37. </head>
  39. <body>
  40. <div class="conteneur">
  41. <div class="header"><p class="top"><a href="http://www.ats3r.org"><img src="../../site/images/accueil.gif" border="0" alt="Accueil"></img></a></p></div>
  43. <?php
  44. echo '<div class="frame">';
  45. echo '<form method="POST" action="ME_liste.php">';
  47. echo '<br><br><br><br><br><br><br><br>';
  48. echo '<table align="center" border="15" bgcolor="#AC9F8C" width="40%">';
  49. echo '<tr>';
  50. echo '<th colspan="2"><h2>Liste disponible</h2></th>';
  51. echo '</tr>';
  53. // Sélection du statut
  54. echo '<tr>';
  55. echo '<th width="20%" align="right" height="35">Liste</th>';
  56. echo '<td>';
  57.  $type=$_POST['type'];
  58.  require("../../config.inc.php" );
  59.  $r_type = "SELECT distinct(type),TB_statut.description FROM `ATS_statut`
  60.       left join TB_statut on ATS_statut.type=TB_statut.code order by TB_statut.description";
  61.  $res = mysql_query($r_type);
  62.  ?>
  63.  <select size="1" name="type" OnChange="sendData('id='+this.value,'lire_an.php')" onKeyUp="sendData('id='+this.value,'lire_an.php')">
  64.  <?php
  65.  while($val=mysql_fetch_array($res)) {
  66.   $selected="";
  67.   if($type == $val["type"]) {$selected=" selected=\"selected\"";}
  68.   echo '<option value='.$val["type"].$selected.'>'.$val["description"].'</option>\n';
  69.  }
  70.  echo '</select>';
  71. echo '</td>';
  72. echo '</tr>';
  74. //include_once('lire_an.php');  
  78. echo '<th align="right" height="35">Type</th>';
  79. echo '</tr>';
  80. echo '<tr>';
  81. echo '<th align="right" height="35">Tri</th>';
  82. echo '</tr>';
  85. echo '<tr>';
  86. echo '<td colspan="2" align="center" height="40"><input type="submit" value="Visualiser la liste"></td>';
  87. echo '</tr>';
  89. echo '</table>';
  90. echo '</form>';
  91. echo '</div>';
  92. echo '<div class="footer"></div>';
  93. echo '</div>';
  94. ?>
  95. </body>
  96. </html


Message édité par fourniey le 17-02-2008 à 21:41:11
Reply

Sujets relatifs:

Leave a Replay

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