Discussion :

[Frack94]

Bonjour à tous,

J'ai implémenté le système de complétion layout suggest et ça fonctionne parfaitement sauf sur IE6 où le div contenant la liste de propositions se met derrière les select que j'ai sur les lignes suivantes !
C'est un bug connu qu'on peut corriger avec des iframes mais je n'ai pas la main sur le div généré par layout:suggest pour y insérer un iframe.

Savez-vous comment remédier à ce problème layout:suggest + IE6?

Exemple: struts layout génère entre autre le div suivant:

Code :

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

1
2
3
4
5
 
<div id="idEntiteSuggestionList" class="suggestionList"></div> 
<input type="hidden" id="idEntiteSuggestionList_selectedFieldText" value="0">
<input type="hidden" id="idEntiteSuggestionList_selectedSuggestionIndex" value="-1">
<input type="hidden" id="idEntiteSuggestionList_typedWord" value="">

Pour corriger le problème des select avec IE il faut insérer un iframe derrière le div mais comment faire avec struts-layout?

Je précise que j'utilise struts-layout 1.2 avec le jar de compatibilité pour struts 1.1.

Après des heures de recherche, j'ai trouvé ça mais ça ne fonctionne pas:
http://javascript.developpez.com/faq...put.div.select

Voici mon code:

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
14
 
<td>
<layout:suggest 
styleId="idEntite"
layout="false"
suggestCount="10"
minWordLength="3"
tooltip="tooltip.codeOuLibelle"
property="codeEntite"
onfocus="javascript: if (isExplorer6 ) putFrame('idEntiteSuggestionList','idEntieFrame');"
suggestAction="/private/getEntiteSuggestions"/>
</td>
 
<!-- les html:select que je veux couvrir sont dans d'autres tr -->

Avec la fonction putFrame suivante:

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
 
function putFrame( theDiv, frameId ){
 
	alert('putFrame');
	var f = document.getElementById(frameId);
     if (f) 
     {
		f.parentNode.removeChild(f);
     } 
     f    = document.createElement("iframe");
	f.id = frameId;
	var d    = document.getElementById(theDiv);
	if (!d) alert('d est null');
	with(f.style)
	{
		position	= "absolute";
	 	width    	= "100px";
	  	height		= "100px";
	 	top			= d.offsetTop+"px";
	  	left		= d.offsetLeft+"px";
	  	zIndex		= "-1";
	  	border      = "1";
	 }   	
	d.appendChild(f);
 
}

Avez-vous une idée? Merci d'avance!

[Frack94]

Je me répond tout seul. J'ai réussi à corriger le problème, j'obtiens maintenant le même comportement sur chaque navigateur sauf sur un point:
lorsque l'utilisateur tape par exemple "a", une liste de suggestion apparait (comportement normal), la liste apparait bien par dessus les select, mais s'il tape ensuite "b" et qu'aucune proposition ne correspond, la liste disparait bien mais l'iframe reste (carré blanc).
Je cherche encore comment résoudre le problème sachant que dans suggest.js, partout où il y a hideSuggestionList, je cache aussi l'iframe (visibility hidden).

Pour la solution que j'ai implémentée, j'appel putFrame légèrement modifié à cet endroit:

Code :

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

1
2
3
4
5
if (elementsMenu.length > 0)
{
//frame rendering
putFrame( textFieldId + "SuggestionList", textFieldId + "Frame", textFieldId, elementsMenu.length );
displaySuggestionList(textFieldId);

et les fonctions suivante sur le layout:suggest

Code :

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

1
2
3
4
 
onblur="javascript: manageOnBlur( event, this.id);"
onkeydown="javascript:manageKeyDown( event, this.id, 1);"
onkeypress="javascript: manageKeyPressSuggest( event, this.id );"