Discussion :

[libuma]

Bonjour � tous,

La question peut sembl�e �trange mais je vous explique :

J'ai deux listes (select multiple) contenant +- 150 lignes.
Je permets de passer les �l�ments d'une liste � une autre.
Lorsqu'un �l�ment passe d'une liste � une autre, certaines choses sont g�n�r�es encore en background.

Tout fonctionne � merveille, seulement, si je d�place les 150 par exemple, ils sont bels et biens d�plac�s mais le bouton submit de mon formulaire ne fonctionne alors plus !

C'est un simple bouton qui appelle une servlet java (<form action=".." ..)

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
 
<input type="submit" name="validation" value="valider"/>

Pouvez-vous m'en dire plus ?

Merci.

[Matthieu2000]

la fonction boule de cristal est en panne. Veuillez laisser un peu plus de code apr�s le beep sonore...

[RomainVALERI]

Comme dit Mathieu, il nous manque des �l�ments* pour en juger...

Par contre, pour r�pondre � ton titre... dans le cas que tu d�cris, ne t'inquiete pas, aucune chance que 150 lignes dans un select soit consid�r� comme "trop de javascript"

Montre-nous plus de code pour un meilleur diagnostic, ou bien un lien si c'est en ligne...


* tiens �a me rappelle un vieux jeu cette phrase... (megalomania pour les connaisseurs )

[libuma]

Voici ce qu'il se passe lorsque j'ajoute d�place des lignes :

Appel de la fonction ajout qui d�termine entre autre quelles sont les lignes consern�es et les d�placent, ensuite appel de addOption qui est en fait, une liste multiple cach�e.

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
 
function Ajouter(){ 	
 var NbEle = -1;  var moved = 0;	var TxtEle = ''; var valueEle='';
 var longu = document.all('lstSource').length;
        for(i = 0; i < longu; i++){
 	  if (document.all('lstSource' ).options[(i-moved)].selected)  {
                    NbEle = (i - moved); TxtEle = document.all('lstSource' ).options[(i - moved)].text; valueEle = document.all('lstSource' ).options[(i - moved)].value;
	if (NbSource != 0 && NbEle != -1){     
                    addOption(document.all('lstSource' ).options[NbEle].value);   	       document.all('lstSource' ).options[NbEle] = null; 	                document.all('lstCible' ).options[NbCible] = new Option(TxtEle,valueEle);  
 if(document.all('userType').selectedIndex==0){  
document.all('lstCible' ).options[NbCible].style.backgroundColor='#f4f6e3';} 
 if(document.all('userType').selectedIndex==1){  
document.all('lstCible' ).options[NbCible].style.backgroundColor='#75c1d1';} 
 if(document.all('userType').selectedIndex==2){ 
 document.all('lstCible' ).options[NbCible].style.backgroundColor='#89d8b5';} 
 if(document.all('userType').selectedIndex==3){  
document.all('lstCible' ).options[NbCible].style.backgroundColor='#33869c';}	  NbCible = NbCible + 1; 	  NbSource = NbSource - 1;     moved = moved +1;	} 	  } 	} 	 }

Ensuite donc, appel de addZones

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
3
4
 
function addOption(valeur){ 
 document.myForm.toUpdate.options[nbAjout]= new Option(valeur,valeur);document.myForm.toUpdate.options[nbAjout].selected='selected';addZones(valeur);nbAjout=nbAjout+1;
}

addZones:

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
 
function addZones(valeur){
  var elmt = document.myForm.zones; var myZones = '';
for(var i=0; i< elmt.options.length; i++)	
{ 		
 if(elmt.options[i].selected == true)     	
 {			
     myZones += elmt.options[i].value; myZones += ':';	
 }
}	
document.myForm.toUpdateZones.options[nbAjout] 
      = new Option(myZones,myZones);
document.myForm.toUpdateZones.options[nbAjout].selected='selected';var valDroit=document.all('userType').options[document.all('userType').selectedIndex].value;
document.myForm.toUpdateRights.options[nbAjout] = new Option(valDroit,valDroit);	
document.myForm.toUpdateRights.options[nbAjout].selected='selected';
}

Voil� le processus, avec �a, m�me sans sa boule de cristal madame irma pourrait s'en sortir

[RomainVALERI]

Il y a d�j� eu dans ce forum de tr�s nombreux thread � propos de form qui ne fonctionnent plus apr�s ajout "dynamique" d'inputs sans passer par le DOM.

Ici, m�me pas la peine de parler de DOM, c'est vraisemblablement du code �crit pour IE uniquement, et qui date beaucoup...

Le code javascript du site est-il trop volumineux dans ton projet pour envisager une r��criture compl�te sur des bases saines ? Si oui, je te conseille une recherche dans ce forum � partir des termes clefs, tu devrais faire une grosse r�colte... ^^

avec �a, m�me sans sa boule de cristal madame irma pourrait s'en sortir

je ne connais pas cette d�veloppeuse appel�e "irma", mais je connais un/une "libuma" qui va faire beaucoup de javascript dans les prochains jours/semaines...

[libuma]

Effectivement, �a doit tourner sur IE et qui plus est, sur une vieille version d'IE !

Sinon, base saine, un exemple concret de changement sain envisageable?

je ne connais pas cette d�veloppeuse appel�e "irma", mais je connais un/une "libuma" qui va faire beaucoup de javascript dans les prochains jours/semaines...

Quelle pr�diction impressionnante !!

Je n'ai pas de bol

Merci pour tes r�ponses.

[Matthieu2000]

Evite de lancer la m�me fontion 150 fois exemple :

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

var eltSource=document.getElementById('lstSource' )

[libuma]

Evite de lancer la m�me fontion 150 fois exemple :

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

var eltSource=document.getElementById('lstSource' )

tu veux dire afin d'�viter d'avoir un peu partout dans la fonction

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
 
  if (document.all('lstSource' ).options[(i-moved)].selected)  {

mais plut�t..

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
 
if(eltSource.options[(i-moved)].selected) {

Si oui, je ne savais pas que �a prenait beaucoup moins de ressources de cette fa�on

[libuma]

ohh et RomainVALERI :

Tu penses qu'utiliser le DOM r�soudrait mon probl�me ?

Avoir par exemple � la place de

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
 
monElement.options[lastIndex] = new Option(val,val);

ce genre :

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
 
var elOptNew = document.createElement('option');

?

[RomainVALERI]

Oui, c'est susceptible de r�soudre ton probl�me. ^^

Je veux dire que �a me semble �tre une des voies d'investigation les plus cr�dibles. En revanche, une fois que cette piste sera assainie, difficile de savoir s'il n'y a pas un (ou plusieurs ) autre(s) probl�me(s) "en dessous"...

En tout cas, oui, je te conseille de commencer par l� pour voir ce que �a donne...

[libuma]

J'ai modifi� un peu tout �a, sauf pour l'ajout d'options dans un select "cach�" (hidden) car apparemment �a ne fonctionne pas pour ceux-ci !!

Mais �a ne r�sous pas mon probl�me

Je vais me rabattre sur les probl�mes d�j� parus si je les trouve, car google ne m'a pas �t� d'une grande aide � ce niveau ^^
Un mot cl� qui pourrait m'aider � trouver ces threads?

Merci

[Gatsu35]

Jsute pour rajouter qu'en JS on a les tableaux comme dans tout autre langage, et il est plus simple de transformer ce pat� :

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
3
4
5
6
7
8
 if(document.all('userType').selectedIndex==0){  
document.all('lstCible' ).options[NbCible].style.backgroundColor='#f4f6e3';} 
 if(document.all('userType').selectedIndex==1){  
document.all('lstCible' ).options[NbCible].style.backgroundColor='#75c1d1';} 
 if(document.all('userType').selectedIndex==2){ 
 document.all('lstCible' ).options[NbCible].style.backgroundColor='#89d8b5';} 
 if(document.all('userType').selectedIndex==3){  
document.all('lstCible' ).options[NbCible].style.backgroundColor='#33869c';}

en :

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
var colors = ['#f4f6e3','#75c1d1','#89d8b5','#33869c'];
document.getElementById('lstCible').options[NbCible].style.backgroundColor = colors[document.getElementById('userType').selectedIndex];

Tu nous montrerais ton HTML ET JS complets et je suis sur qu'il y a mega moyen d'optimiser ton code de tous les cot�s

[SpaceFrog]

de m�me faire des boucles for ayant pour limite un length l'element est gourmande et p�rilleux
mieux vaut recup�rer le length avant ou faire une boucle while

[libuma]

Jsute pour rajouter qu'en JS on a les tableaux comme dans tout autre langage, et il est plus simple de transformer ce pat� :

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
3
4
5
6
7
8
 if(document.all('userType').selectedIndex==0){  
document.all('lstCible' ).options[NbCible].style.backgroundColor='#f4f6e3';} 
 if(document.all('userType').selectedIndex==1){  
document.all('lstCible' ).options[NbCible].style.backgroundColor='#75c1d1';} 
 if(document.all('userType').selectedIndex==2){ 
 document.all('lstCible' ).options[NbCible].style.backgroundColor='#89d8b5';} 
 if(document.all('userType').selectedIndex==3){  
document.all('lstCible' ).options[NbCible].style.backgroundColor='#33869c';}

en :

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
var colors = ['#f4f6e3','#75c1d1','#89d8b5','#33869c'];
document.getElementById('lstCible').options[NbCible].style.backgroundColor = colors[document.getElementById('userType').selectedIndex];

Tu nous montrerais ton HTML ET JS complets et je suis sur qu'il y a mega moyen d'optimiser ton code de tous les cot�s

Ces informations ne resteront pas en claire dans le code, d'o� le travail assez laborieux.
Ceci dit, je suis s�r qu'effectivement il y aurait moyen que j'en apprenne pas mal oui, je ne suis pas bal�se en js.
Je ne sais pas si je peux poster mon fichier js ici

[RomainVALERI]

Je ne sais pas si je peux poster mon fichier js ici

S'il est en ligne, ne t'embete pas avec des pieces jointes, donne nous un lien

[libuma]

Non, il n'est pas en ligne, je l'attache ci-joint : scriptt.js

Tout fonctionne sauf le probl�me que je vous ai evoqu�..

Si j'ajoute trop de champs, le bouton submit de mon form ne r�pond plus.

Le principe est donc, j'ajoute dans des listes cach�es les infos qui ont �t� d�plac�es d'une liste � l'autre pour pouvoir enregistrer les modifs par la suite.

[libuma]

Pour ceux � qui �a dit quelque chose..
J'ai localis� plus pr�cis�mment le probl�me...

Il survient lorsque j'ajoute donc massivement des donn�es de la liste gauche vers la droite (pas nouveau) mais le probl�me survient plus particuli�rement, quand j'ajoute les donn�es dans une des deux autres listes invisibles..(sachant que j'en remplis une premi�re auparavant)

Donc d�s que je fais :

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
3
4
 
toUpdateZonesElmt.options[nbAjout] 
      = new Option(myZones,myZones);
toUpdateZonesElmt.options[nbAjout].selected='selected';

ou :

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
3
 
toUpdateRightsElmt.options[nbAjout] = new Option(valDroit,valDroit);	
toUpdateRightsElmt.options[nbAjout].selected='selected';

[libuma]

ps: Le bouton submit ne r�pond pas, mais lorsque je mets

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
 
<form ... onSubmit='alert(123);'..>

l'alerte se produit bien !
Par contre si j'essaye m�me de faire un "document.myForm.submit()" �a ne fonctinne pas non plus :s

aie:

[libuma]

Ok c'est r�solu...

L'astuce en fait, est tout le monde le sait(ou presque) mais il faut y penser !
C'est que.. je passe mes valeurs � l'aide d'un formulaire methode GET.
Hors, get, poss�de une limite quant � la taille des param�tres pass�s !

C'est donc �a le probl�me et rien � voir avec le javascript !

Merci quand m�me � ceux qui ont essay�.

Bonne journ�e

ps: je suis toujours partant pour l'optimisation si quelqu'un a regard�