plugin mSelect. Utilisation du plugin avec plusieurs listes.

Version imprimable

Bonjour,

Je viens de mettre la main sur un plugin assez intéressant :
http://www.le-pret-a-surfer.com/web/...s/#comment-251

Exemple : http://le-pret-a-surfer.com/jquery/mSelect/

Cependant je n'arrive pas à l'utiliser comme je le souhaite.
En effet j'aimerai pouvoir récupérer les valeurs des autres listes de la page lorsque l'utilisateur choisi une option d'une liste.
Cela pour rafraichir un tableau à l'aide de plusieurs filtres.

Malheureusement lorsque j'utilise cette méthode je n'ai pas le message d'alert me donnant la valeur sélectionné de l'autre liste :
Code:

1 2 3 4 5 6 7 8 9 10 11 12 13 <script type="text/javascript"> $(document).ready(function() { $('select').mSelect({ eventClick:function(value,html) { sel = document.getElementById('type'); id_type = sel.options[sel.selectedIndex].value; alert(id_type); } }); }); </script>
Il y aurait il une âme charitable en cette fin d'année afin de me guider ;).

Merci par avance.

Code:

1
2
3
4
5
6
7
8
9
10
11
12
<script type="text/javascript">
 
$(document).ready(function() {
	$('select').mSelect({
	  eventClick:function(value,html) {
		// sel = document.getElementById('type');
		// id_type = sel.options[sel.selectedIndex].value;
		alert(value);
	  }
	});
});
</script>

30/12/2010, 15h27
@po©alypse

Ceci ne me donne la valeur que de celui sélectionné.
Or si j'ai deux filtres je veux pouvoir filtrer mon tableau sur les deux select et non oublier l'un des filtres lorsque l'utilisateur affine la recherche avec l'autre filtre.
30/12/2010, 15h53
Pierrot0459

Code:

$(".tesselect option:selected").each(function () {

a++

Citation:

Envoyé par Pierrot0459

$(".tesselect option:selected").each(function () {

a++

Clair et concis :).
Merci de ton aide mais étant néophyte en la matière pourrais tu me donner un peu plus de détail ?

Voici ce que je fais en gros actuellement :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
 
 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr">
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
	<title>Page type</title>
 
	<script type="text/javascript" src="/js/jquery-1.4.2.min.js"></script>
	<script type="text/javascript" src="http://le-pret-a-surfer.com/jquery/mSelect/jquery.mSelect.min.js"></script>
	<script type="text/javascript">
		$(document).ready(function(){
			$("#affiche").html("<p>" + $("select[name='genre'] option:selected").val() +
													";" + $("select[name='statut'] option:selected").val() + "</p>");
 
 
			$("select").change(function(){
				$("#affiche").html("<p>" + $("select[name='genre'] option:selected").val() +
													";" + $("select[name='statut'] option:selected").val() + "</p>");
			});
		});
	</script>
 
	<link href="/css/font.css" rel="stylesheet" type="text/css" />
</head>
<body>
	<div id="conteneur">
		<form name="monForm">			
			<select name="genre">
				<option value="-1" selected="selected">Filtrer par genre</option>
				<option value="M">Masculin</option>
				<option value="N">Féminin</option>
			</select>
			<select name="statut">
				<option value="-1" selected="selected">Filtrer par type</option>
				<option value="H">Homme</option>
				<option value="F">Femme</option>
			</select>
 
		</form>
		<div id="affiche"></div>
	</div>
 
	<script type="text/javascript">
		$(document).ready(function() {
			$("select").mSelect();
		});
 
 
	</script>
</body>
</html>