Discussion :

[devlm]

bonjour,

je souhaite dans un tableau sur une colonne pouvoir au clic sur une petite flèche afficher la liste des utilisateurs sous forme de menu pour faire un filtre.

J'ai un tableau classique.

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
<table width="100%"  border="0" cellspacing="3" cellpadding="2">
	<thead>
		<tr>
			<th class="titre-colonne-multi texte-gras">Suivi <img src="images/btn-expand-liste.png" border="0" alt="Filtrer sur le Suivi " class="filtre-suivi-bfi"/></th>
			<th class="titre-colonne-multi texte-gras">Affaire </th>
			<th class="titre-colonne-multi texte-gras">Acquéreur(s)</th>
			<th class="titre-colonne-multi texte-gras">Vendeur</th>
</tr>
	</thead>			
	<tbody></tbody></table>

J'utilise Jquery et Juqery ui pour la mise en forme de ce menu:

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
<div id="menu-suivi-bfi" style="position:relative;">
	<ul id="suivi-bfi" style="display: none; z-index:1000;">
		<li><a href="#">Ada</a></li>
		<li><a href="#">Adamsville</a></li>
		<li><a href="#">Addyston</a></li>
		<li><a href="#">Ada</a></li>
		<li><a href="#">Adamsville</a></li>
		<li><a href="#">Addyston</a></li>
		<li><a href="#">Ada</a></li>
		<li><a href="#">Adamsville</a></li>
		<li><a href="#">Addyston</a></li>
	</ul>
</div>

Enfin, j'utilise le code suivant pour afficher le menu au clic sur la flèche.

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
$(".filtre-suivi-bfi").click(function () {
	$("#suivi-bfi").position({
		"my": "left top",
		"at": "right bottom",
		"of": $(".filtre-suivi-bfi")
	}).show();
	$( "#suivi-bfi" ).menu();
});

Je rencontre une difficulté, le menu apparait, seulement, au lieu de se dérouler vers le bas à partir du parent, il se déroule vers le haut.

J'ai essayé les différentes possibilités sur le site Jquery, c'est bien celle ci qui doit lui permettre de se dérouler vers le bas.

Avez-vous une idée ?
Merci.

[devlm]

Résolu, j'ai rajouté :

Code css :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
#suivi-bfi {
position: absolute;
z-index:1000;
}