Discussion :

[Bobble]

Bonjour,

j'ai une page jsf contenant des checkboxes. J'ai une checkbox "principale" qui permet de sélectionner/désélectionner toutes les autres. Mais j'ai un petit souci de vitesse. Il faut 2 secondes pour que toutes les 50 checkboxes soient cochées...rien de grave, mais ce n'est pas très propre...

J'aimerais savoir s'il y a d'autres possibilités pour faire la même chose, mais bien plus performantes..

Voilà mon code:

Fonction Javascript:

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
function selectUnselectAllFields(checkbox)
{
	var elements = document.forms.tSearch.elements;
	for (var i = 0; i < elements.length; i++)
	{
		var el = elements[i];
		if (el.name != null && /^tSearch:cb\d*/.test(el.name))			
		{
			el.checked = checkbox.checked;
		}
	}
}

JSF:

Code :

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

1
2
3
4
5
6
<h:panelGrid columns="2" columnClasses="formInputSmallFont, formInputSmallFont">
	<f:verbatim>
		<input type="checkbox" onclick="selectUnselectAllFields(this)"></input>
	</f:verbatim>
	<h:outputText value="Select All"/>
</h:panelGrid>

Code :

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

1
2
3
4
5
6
7
8
<h:panelGrid columns="12" columnClasses="formInputSmallFont,formInputSmallFont,formInputSmallFont,formInputSmallFont,formInputSmallFont,formInputSmallFont,formInputSmallFont,formInputSmallFont,formInputSmallFont,formInputSmallFont,formInputSmallFont,formInputSmallFont">
	<h:selectBooleanCheckbox id="cbTID" value="#{terminalManager.cbTID}"/>
	<h:outputText value="TID" />
	<h:selectBooleanCheckbox id="cbMID" value="#{terminalManager.cbMID}"/>
	<h:outputText value="MID" />
 
.....autres 48 Checkbox.....
</h:panelGrid>

[SpaceFrog]

faire la regexp à l'intérieur de la boucle ... tu m'etonnes que ce soit lent ...

Code :

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

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
 
<script type="text/javascript">
 
document.getElementsByReg=function(reg,attr){
var tabReg=new Array();
var tabElts=document.body.getElementsByTagName('*');
var TEL=tabElts.length;
if(! (reg instanceof RegExp)){return tabReg;}
i=0;
while(tabElts[i]){
		if(tabElts[i][attr]){
 
	         if(reg.test(tabElts[i][attr])){tabReg.push(tabElts[i]);}
	         }
	i++;         
	}
return tabReg;
}
 
function selectUnselectAllFields(checkbox)
{
	var elements = document.forms.getElementsByReg(/^tSearch:cb\d*/s,name);
var i=-1;
while(elements[++i])
	{
			elements[i].checked=true;
		}
	}
}

[javatwister]

revoir aussi http://www.developpez.net/forums/d30...e/#post1911324

[Bobble]

Merci!!

J'ai juste adapté un peut le code de SpaceFrog, je ne comprend pas trop d'où prendre "name" dans "selectUnselectAllFields" et comment fonctionne "[attr]" dans "document.getElementsByReg=function(reg,attr)". Mais je crois de n'en avoir pas besoin, car je compare tous les elements avec mon reg...

Ensuite j'ai juste crée une nouvelle fonctions, j'avais un erreur avec la formule "document.getElementsByReg=function(reg,attr){", la fonction n'était pas trouvée...

Mais comme ça, chez moi ça fonctionne ni quel, c'est pratiquement instantané:

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
function selectUnselectCheckBox(reg)
{	
	var tabReg=new Array();
	var tabElts=document.body.getElementsByTagName('*');
 
	if(! (reg instanceof RegExp)){return tabReg;}
	i=0;
	while(tabElts[i]){
		if(reg.test(tabElts[i].name)){tabReg.push(tabElts[i]);}  
		i++;         
	}
	return tabReg;
}
 
function selectUnselectAllFields(checkbox)
{ 
	var elements = selectUnselectCheckBox(/^tSearch:cb\d*/);
	var i=-1;
	while(elements[++i])
	{
		elements[i].checked=checkbox.checked;
	}
}