Formulaire de recherche

Bonjour, j'ai dans un formulaire de recherche un select avec une liste de catégorie, et quand je sélectionne une option j'ai un tableau qui s'affiche avec d'autre option de recherche !

Les résultats s'afiche bien mais si je rafraîchie la page ou passe a la page numero 2 mon select reste sur la bonne catégorie mais je ne vois plus mon tableau avec les autre option !

Qui aurais une petite solution ou une idée ?

<select name="c" class="input_recherche" onchange="maFunction(this);">
  <option value="">Toutes les catégories</option>
  
  <!-- Liste des categorie  -->
  <option value="<?php echo $row_categorie['id_categorie']; ?>" <?php if (!(strcmp($row_categorie['id_categorie'], htmlentities($_GET['c'], ENT_COMPAT, 'UTF-8')))) {echo "SELECTED";} ?>><?php echo $row_categorie['categorie']; ?></option>
  <!-- fin de la liste   -->
  
</select>
<tr valign="baseline" id="1" style="display:none">
  <td colspan="2" align="center" nowrap="nowrap"> Les autre option !! </td>
</tr>

<script type="text/javascript">
var list = ["1", "2"]; // y ajouter les autres ids !
var maFunction = function(select){
  for(var i = 0; i< list.length; i++)
    document.getElementById(list[i]).style.display = "none";

  var val = select.options[select.selectedIndex].value ;
  document.getElementById(val).style.display = "table-row" ;
}
</script>]

[/i]
Modifié par bibi67 (05 Aug 2014 - 14:22)

Lorsque tu rafraîchis la page aucun événement change n'est généré.

Tu as 2 options:

- Le mieux ce serait que côté serveur tu génères directement le contenu de ton tableau en fonction de la valeur sélectionnée (et du coup enlève le display: none sur ce tableau dans ce cas).
- Le plus facile: lancer un événement change sur le select pour que ta maFonction soit appelée lorsque ta page est rendue: document.getElementsByClassName("input_recherche")[0].dispatchEvent(new Event('change'))