[Struts-Layout] + [CSS] Problème div scrollable avec layout:collection
Bonjour à tous,
alors voilà mon souci...ça fait un petit moment que je retourne le problème dans tous les sens et ça commence à me :aie:
J'ai une <layout:collection> que je fais apparaître dans un formulaire...seulement voilà, ma collection peut parfois être assez longue, aussi, je l'ai incluse dans une div scrollable (donc avec overflow:auto et une hauteur fixe...).
Dans un but ergonomique, je veux placer le bouton "submit" de mon fomulaire en dehors de cette div scrollable. Sachant que j'ai deux collections à faire apparaître, l'une avec les éléments à ajouter et l'autre avec les éléments à supprimer, j'ai voulu les faire apparaître l'une à côté de l'autre...
Ce qui me donne en définitive :
ma page jsp :
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
| <div id="conteneurCommunes">
<div id="ajoutCommunes">
<layout:form action="/ajouterCommunes">
<div id="communes">
<logic:notEmpty name="communes" scope="session">
<layout:collection name="communes" id="commune"
indexId="index" styleClass="FORM" width="300">
<layout:collectionItem title="COG" property="code"/>
<layout:collectionItem title="Nom Commune" property="nomcommune"/>
<layout:collectionItem title="Nombre Logements" property="nblogements"/>
<layout:collectionItem title="Ajouter">
<layout:checkbox name="communeForm" property="selects" layout="false" value="${commune.code}" />
</layout:collectionItem>
</layout:collection>
</logic:notEmpty>
</div>
<layout:submit>
<layout:message key="ajouter.communes" bundle="resources" />
</layout:submit>
</layout:form>
</div>
<div id="suppressionCommunes">
<layout:form action="/supprimerCommunes">
<div id="communes">
<logic:notEmpty name="communesSelect" scope="session">
<layout:collection name="communesSelect" indexId="index"
id="commune" styleClass="FORM">
<layout:collectionItem title="COG" property="code"/>
<layout:collectionItem title="Nom Commune" property="nomcommune"/>
<layout:collectionItem title="Nombre Logements" property="nblogements"/>
<layout:collectionItem title="Supprimer">
<layout:checkbox name="communeForm" property="selects" layout="false" value="${commune.code}" />
</layout:collectionItem>
</layout:collection>
</logic:notEmpty>
</div>
<layout:submit>
<layout:message key="supprimer.communes" bundle="resources" />
</layout:submit>
</layout:form>
</div>
</div> |
et ma feuille de style :
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
| #conteneurCommunes{
width:750px;
height:300px;
border: double 2px black;
overflow:auto;
}
#communes{
width:300px;
height:250px;
overflow:auto;
}
#ajoutCommunes{
width:350px;
height:300px;
float:left;
border: double 2px black;
overflow:auto;
}
#suppressionCommunes{
width:350px;
height:300px;
float:right;
border: double 2px black;
overflow:auto;
} |
Mon problème : la collection n'est pas dans la div scrollable, au lieu de ça, il me crée une div scrollable au dessus de mon formulaire et donc de ma collection :?
Si quelqun a une solution miracle, je suis preneur...
PS : je sais qu'il existe une possibilité de déporter le submit d'un formulaire sur un bouton extérieur en utilisant du javascript mais j'aimerais éviter...
Merci d'avance !! :mrgreen:
