Comment cibler les listes déroulantes du composant ui multiselect

Version imprimable

Bonjour,

Je suis en train d'intéger le widget ui multiselect dans mon application Struts2 mais je rencontre des difficultées dans sa mise en place. Dans mon ecran j'ai des listes deroulantes pour lesquelles je veux utiliser le composant multiselect et d'autre ou je ne veux pas. voici les differents cas que j'ai :

1er cas :

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
<%@ taglib prefix="s" uri="/struts-tags"%>
<%@ taglib uri="http://displaytag.sf.net/el" prefix="display"%>
<%@ taglib prefix="sj" uri="/struts-jquery-tags"%>
<link rel="stylesheet"
    href="<s:url value="/windowfiles/dhtmlwindow.css"/>" type="text/css" />
<link rel="stylesheet"
    href="<s:url value="/css/jquery.multiselect.css"/>" type="text/css" />
<link rel="stylesheet"
    href="<s:url value="/css/jquery.multiselect.filter.css"/>"
    type="text/css" />
 
<script type="text/javascript"
    src="<s:url value="/js/jquery-1.9.1.min.js" />"></script>
<script type="text/javascript"
    src="<s:url value="/js/jquery-ui.min.js" />"></script>
<script type="text/javascript"
    src="<s:url value="/js/jquery.multiselect.min.js" />"></script>
<script type="text/javascript"
    src="<s:url value="/js/jquery.multiselect.filter.js" />"></script>
 
 
<script language="javascript"><!--
 
$(function(){
       $("select").multiselect(); 
       $("select").multiselect().multiselectfilter();
    });
 
--></script>
<s:form action="myAction.do" name="myForm" id="idMyForm" theme="simple">
    <table height="100%" width="100%" border="0">
        <tr>
            <td><s:select id="idCombo1" list="listItems1"
                    name="combo1" value="%{value1}" listKey="id" listValue="label"/>
            </td>
        </tr>
        <tr>
            <td><s:select id="idCombo2" multiple="multiple" list="listItems2"
                    name="combo2" value="%{value2}" listKey="id" listValue="label"/>
            </td>
        </tr>
    </table>
</s:form>

Lors du rendu de ma page toutes les listes sont en mode multi selection (avec des cases à cocher) or que je ne souhaite ce ne soit que la seconde liste qui le soit.

Cas 2

je remplace :

Code:

1
2
3
4
$(function(){
       $("select").multiselect(); 
       $("select").multiselect().multiselectfilter();
    });

par

Code:

1
2
3
4
5
$(document).ready(function() {
		$("#idCombo2").multiselect({
			selectedList: 4
		});
	});

et la plus rien n'est en mode multiselection

Je ne sais pas quoi faire...

19/10/2013, 11h58
NoSmoking
Bonjour,

Citation:

Lors du rendu de ma page toutes les listes sont en mode multi selection (avec des cases à cocher) or que je ne souhaite ce ne soit que la seconde liste qui le soit.

puis...

Citation:

et la plus rien n'est en mode multiselection

c'est presque ce que tu cherches non, mais qu'est ce que cela veut dire au juste !!

A voir à tout mettre en simple et uniquement ciblé celui en à mettre en double
Code:

1 2 3 4 5 6 7 8 9 $(function () { $("select").multiselect({ multiple: false }); $("#idCombo2").multiselect({ multiple: true, selectedList: 4 }); });
21/10/2013, 10h33
ombinte

merci pour ton aide noSmoking, mais en faisant ce que tu as fais ça ne fonctionne pas. L'attribut multiple=false est appliqué à toutes les combos malgré la seconde partie qui spécifie que pour la combo 2 elle doit être en mode multi.

Essaye avec

Code:

1
2
3
4
5
6
7
8
9
$(function () {
    $("select").multiselect({
        multiple: false
    });
    $("#idCombo2").multiselect('options', {
        multiple: true,
        selectedList: 4
    });
});

21/10/2013, 10h52
ombinte

Helas Bovino ça ne marche pas non plus...j'ai toujours l'attribut multiple=false qui est appliqué à toutes les combos...je ne suis pas très bon en javascript du coup je suis un peu bloqué...
21/10/2013, 11h15
Bovino
Arf... c'est option, pas options... Ensuite, reste à voir si tu peux affecter plusieurs options via un objet, sinon, fais-le en deux fois :
Code:

1 2 $("#idCombo2").multiselect('option', 'multiple', true); $("#idCombo2").multiselect('option', 'selectedList', 4);

J'ai toujours le même comportement hélas...j'ai essayé de mettre cette partie dans le document.ready mais l'attribut multiple qui est appliqué à toutes les listes est celui qui est définie pour les select.

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
<script language="javascript">
<!--
 
	$( document ).ready(function() {
		$("#idCombo2").multiselect('option', 'multiple', true);
		$("#idCombo2").multiselect('option', 'selectedList', 4);
 
	});
 
	$(function () {
 
		$("select").multiselect({
			multiple: false
		});
 
		$("select").multiselect().multiselectfilter();
 
		//$("#activityValues").multiselect('option', {
			//multiple: true,
			//selectedList: 4
		//});
 
 
 
	});
//-->
</script>

21/10/2013, 11h49
Bovino

Ben c'est sûr que si tu essayes d'affecter des options avant d'avoir initialisé les multiselect, ça risque de moins bien marcher... :whistle:

lol oui désolé j'ai enormement de mal avec le javascript...cela dit j'ai essayé cette solution après avoir fais cela

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
 
<script language="javascript">
<!--
 
	$(function () {
 
		$("select").multiselect({
			multiple: false
		});
 
		$("select").multiselect().multiselectfilter();
 
		//$("#idCombo2").multiselect('option', {
			//multiple: true,
			//selectedList: 4
		//});
 
		$("#idCombo2").multiselect('option', 'multiple', true);
		$("#idCombo2").multiselect('option', 'selectedList', 4);
 
	});
 
//-->
</script>

21/10/2013, 19h00
NoSmoking

Je viens de tester le code que j'ai mis plus haut et il fonctionne tout à fait, l'erreur ne serait-elle pas ailleurs?
22/10/2013, 11h14
ombinte

Oui, c'est bon ça marche...je viens de trouver ce qui n'allait pas. ça venait de l'id des composants select. Dans l''exemple que j'ai posté j'ai du anomyser certains éléments. Les identifiants de composants n'etait pas au format camelCase. Pourquoi ? je ne sais pas car c'est une application que je reprend mais voila le problème était du à cela. Donc voici la solution que j'utilise est celle que tu m'as donné NoSmoking. Merci de votre aide !