Le problème est du au composant ice:dataTable (je pense). Quand ce composant contient un nombre de colonnes supérieurs à la largeur de l'écran. La largeur de la dataTable dépasse celle de l'écran même avec un overflow : auto pour avoir l'ascenseur.

Moi je voudrais que la datatable soit toujours à l'intérieur de la fenêtre et si jamais sa largeur dépasse, un ascenseur est crée pour empêcher ce dépassement avec un ascenseur pour la datatable et non pas pour toute la fenêtre.

En PJ il y a une image qui montre ce probléme.

Maintenant je vous explique l'exemple que j'ai mit pour montrer ce "bug"

Mon formulaire doit être inserer dans une sorte de template, le voila le template :

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
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
<?xml version='1.0' encoding='UTF-8'?>
<jsp:root jsfc="f:view" xmlns:jsp="http://java.sun.com/JSP/Page" version="2.0" xmlns:h="http://java.sun.com/jsf/html" xmlns:f="http://java.sun.com/jsf/core" xmlns:c="http://java.sun.com/jstl/core"
xmlns:ice="http://www.icesoft.com/icefaces/component" xmlns:ui="http://java.sun.com/jsf/facelets">
  <ice:outputDeclaration doctypeRoot="HTML" doctypePublic="-//W3C//DTD XHTML 1.0 Transitional//EN" doctypeSystem="http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd" />
 
  <html>
    <head>
      <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
      </meta>
 
      <title id="dynamicTitle">
        <ui:insert name="title">EXTRANET</ui:insert>
      </title>
 
      <link rel='stylesheet' type='text/css' href='${facesContext.externalContext.requestContextPath}/xmlhttp/css/rime/rime.css' />
 
      <link rel='stylesheet' type='text/css' href='${facesContext.externalContext.requestContextPath}/css/core.css' />
    </head>
 
    <body >
    <center>
      <div id="header" >
       <ice:panelGrid columns="2" cellpadding="0" cellspacing="0" styleClass="headerGrid">
        <ice:graphicImage url="/images/layout/logo.jpg" />
        </ice:panelGrid>
      </div>
 
      <ice:panelGrid columns="2" cellpadding="5" cellspacing="0" styleClass="layoutGrig" >
        <div id="menu">
          <ui:insert name="navigation">
            <ui:include src="navigation.jspx" />
          </ui:insert>
        </div>
 
        <div id="principal">
          <div class="principal2">
            <div class="haut">
              <div class="coingh">
                <div style="margin:0px 0px 0px 30px;">
                	<ui:insert name="page-header" />                	
               </div>    
              </div>
 
              <div class="coindh">              
              </div>
            </div>
 
            <div class="contenu" >              
                <ui:insert name="page-content" />
            </div>
 
            <div class="bas">
              <div class="coingb">
              </div>
 
              <div class="coindb">
              </div>
            </div>
          </div>
        </div>
      </ice:panelGrid>
</center>
 
       <!-- 
          PRELOAD IMAGES need for roleovers and layout in general, javascript is only
          loaded once per refresh which is good enough.  This improves overall user
          experience as they shouldn't have to wait for images to show up after the
          initial load.
          --> <script language="JavaScript" type="text/javascript">
            // <![CDATA[ 
            var preloaded = new Array();
            function preload_images() {
                for (var i = 0; i < arguments.length; i++) {
                    preloaded[i] = document.createElement('img');
                    preloaded[i].setAttribute('src', arguments[i]);
                }
            }
            preload_images(
                    './xmlhttp/css/rime/css-images/arrow-ff.gif',
                    './xmlhttp/css/rime/css-images/arrow-ff-dis.gif',
                    './xmlhttp/css/rime/css-images/arrow-first.gif',
                    './xmlhttp/css/rime/css-images/arrow-first-dis.gif',
                    './xmlhttp/css/rime/css-images/arrow-fr.gif',
                    './xmlhttp/css/rime/css-images/arrow-fr-dis.gif',
                    './xmlhttp/css/rime/css-images/arrow-last.gif',
                    './xmlhttp/css/rime/css-images/arrow-last-dis.gif',
                    './xmlhttp/css/rime/css-images/arrow-next.gif',
                    './xmlhttp/css/rime/css-images/arrow-next-dis.gif',
                    './xmlhttp/css/rime/css-images/arrow-previous.gif',
                    './xmlhttp/css/rime/css-images/arrow-previous-dis.gif',
                    './xmlhttp/css/rime/css-images/bottom_menu_bg.png',
                    './xmlhttp/css/rime/css-images/bottom_menu_btn_bg_on.png',
                    './xmlhttp/css/rime/css-images/bullet.gif',
                    './xmlhttp/css/rime/css-images/cal_arrow_left.gif',
                    './xmlhttp/css/rime/css-images/cal_arrow_left_dis.gif',
                    './xmlhttp/css/rime/css-images/cal_arrow_right.gif',
                    './xmlhttp/css/rime/css-images/cal_arrow_right_dis.gif',
                    './xmlhttp/css/rime/css-images/cal_button.gif',
                    './xmlhttp/css/rime/css-images/cal_off.gif',
                    './xmlhttp/css/rime/css-images/column_sort_asc.gif',
                    './xmlhttp/css/rime/css-images/column_sort_desc.gif',
                    './xmlhttp/css/rime/css-images/connect_active.gif',
                    './xmlhttp/css/rime/css-images/connect_caution.gif',
                    './xmlhttp/css/rime/css-images/connect_disconnected.gif',
                    './xmlhttp/css/rime/css-images/connect_idle.gif',
                    './xmlhttp/css/rime/css-images/contentContainer_bg.gif',
                    './xmlhttp/css/rime/css-images/contentContainer_bg_up.gif',
                    './xmlhttp/css/rime/css-images/off-left-bot.gif',
                    './xmlhttp/css/rime/css-images/off-left-top-dis.gif',
                    './xmlhttp/css/rime/css-images/off-mid-bot.gif',
                    './xmlhttp/css/rime/css-images/off-mid-top-dis.gif',
                    './xmlhttp/css/rime/css-images/off-right-bot.gif',
                    './xmlhttp/css/rime/css-images/off-right-top-dis.gif',
                    './xmlhttp/css/rime/css-images/PnlClpsblCnt_bullet.gif',
                    './xmlhttp/css/rime/css-images/PnlHdr_bgslice.gif',
                    './xmlhttp/css/rime/css-images/PnlHdr_collapsed.gif',
                    './xmlhttp/css/rime/css-images/PnlHdr_down.gif',
                    './xmlhttp/css/rime/css-images/ProgFill_bg.gif',
                    './xmlhttp/css/rime/css-images/ProgFill_Indet_Bg_active.gif',
                    './xmlhttp/css/rime/css-images/ProgFill_Indet_Bg_inactive.gif',
                    './xmlhttp/css/rime/css-images/Tab_Btm_LftBtm.gif',
                    './xmlhttp/css/rime/css-images/Tab_Btm_LftBtm_off.gif',
                    './xmlhttp/css/rime/css-images/Tab_Btm_LftMid.gif',
                    './xmlhttp/css/rime/css-images/Tab_Btm_LftMid_off.gif',
                    './xmlhttp/css/rime/css-images/Tab_Btm_MidBtm.gif',
                    './xmlhttp/css/rime/css-images/Tab_Btm_MidBtm_off.gif',
                    './xmlhttp/css/rime/css-images/Tab_Btm_MidMid.gif',
                    './xmlhttp/css/rime/css-images/Tab_Btm_MidMid_off.gif',
                    './xmlhttp/css/rime/css-images/Tab_Btm_RtBtm.gif',
                    './xmlhttp/css/rime/css-images/Tab_Btm_RtBtm_off.gif',
                    './xmlhttp/css/rime/css-images/Tab_Btm_RtMid.gif',
                    './xmlhttp/css/rime/css-images/Tab_Btm_RtMid_off.gif',
                    './xmlhttp/css/rime/css-images/Tab_LftMid.gif',
                    './xmlhttp/css/rime/css-images/Tab_LftMid_off.gif',
                    './xmlhttp/css/rime/css-images/Tab_LftTop.gif',
                    './xmlhttp/css/rime/css-images/Tab_LftTop_off.gif',
                    './xmlhttp/css/rime/css-images/Tab_MidMid.gif',
                    './xmlhttp/css/rime/css-images/Tab_MidMid_bullet.gif',
                    './xmlhttp/css/rime/css-images/Tab_MidMid_bullet_off.gif',
                    './xmlhttp/css/rime/css-images/Tab_MidMid_bullet_over.gif',
                    './xmlhttp/css/rime/css-images/Tab_MidMid_off.gif',
                    './xmlhttp/css/rime/css-images/Tab_MidTop.gif',
                    './xmlhttp/css/rime/css-images/Tab_MidTop_off.gif',
                    './xmlhttp/css/rime/css-images/Tab_RtMid.gif',
                    './xmlhttp/css/rime/css-images/Tab_RtMid_off.gif',
                    './xmlhttp/css/rime/css-images/Tab_RtTop.gif',
                    './xmlhttp/css/rime/css-images/Tab_RtTop_off.gif',
                    './xmlhttp/css/rime/css-images/table-border.gif',
                    './xmlhttp/css/rime/css-images/table_col_header.gif',
                    './xmlhttp/css/rime/css-images/theme_bg.gif',
                    './xmlhttp/css/rime/css-images/theme_change_bg.gif',
                    './xmlhttp/css/rime/css-images/tree_close.gif',
                    './xmlhttp/css/rime/css-images/tree_document.gif',
                    './xmlhttp/css/rime/css-images/tree_folder_closed.gif',
                    './xmlhttp/css/rime/css-images/tree_folder_doc.gif',
                    './xmlhttp/css/rime/css-images/tree_folder_open.gif',
                    './xmlhttp/css/rime/css-images/tree_line_blank.gif',
                    './xmlhttp/css/rime/css-images/tree_line_last_node.gif',
                    './xmlhttp/css/rime/css-images/tree_line_middle_node.gif',
                    './xmlhttp/css/rime/css-images/tree_line_vertical.gif',
                    './xmlhttp/css/rime/css-images/tree_nav_bottom_close.gif',
                    './xmlhttp/css/rime/css-images/tree_nav_bottom_open.gif',
                    './xmlhttp/css/rime/css-images/tree_nav_middle_close.gif',
                    './xmlhttp/css/rime/css-images/tree_nav_middle_open.gif',
                    './xmlhttp/css/rime/css-images/tree_nav_top_close.gif',
                    './xmlhttp/css/rime/css-images/tree_nav_top_close_no_siblings.gif',
                    './xmlhttp/css/rime/css-images/tree_nav_top_open.gif',
                    './xmlhttp/css/rime/css-images/tree_nav_top_open_no_siblings.gif',
                    './xmlhttp/css/rime/css-images/tree_open.gif',
 
                    './css/images/navigation-tree/tree_folder_closed.gif',
                    './css/images/navigation-tree/tree_folder_open.gif',
                    './css/images/navigation-tree/tree_node.gif',
                    './css/images/navigation-tree/tree_node_rollover.gif',
                    './css/images/navigation-tree/tree_node_selected.gif',
 
                    './images/panelStack/address-thumb.png',
                    './images/panelStack/auction-thumb.png',
                    './images/panelStack/mobility-thumb.png',
                    './images/panelStack/timezone-thumb.png'
 
                    );
                   // ]]>
              </script>
 
 
 
 
 
    </body>
  </html>
</jsp:root>

Mon formulaire sera inserer ici <ui:insert name="page-content" />

Je peux vous mettre le core.css mais c'est assez grand. Ce que je peux dire sur ce template c'est qu'il a comme largeur : 90% de la largeur de l'écran. Donc mon formulaire doit normalement prendre 100% du template cad 100% des 90% de l'écran.

Jusqu'ici on est bon

Voila ma vue

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
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
<?xml version='1.0' encoding='UTF-8'?>
<jsp:root jsfc="f:view" xmlns:jsp="http://java.sun.com/JSP/Page" version="2.0" xmlns:h="http://java.sun.com/jsf/html"
xmlns:f="http://java.sun.com/jsf/core" xmlns:ice="http://www.icesoft.com/icefaces/component">
  <f:view>
    <ice:outputDeclaration doctypeRoot="HTML" doctypePublic="-//W3C//DTD XHTML 1.0 Transitional//EN"
    doctypeSystem="http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd" />
 
   <ice:outputHtml id="outputHtml1">
 
      <ice:outputHead>
        <!-- <link href="./xmlhttp/css/xp/xp.css" rel="stylesheet" type="text/css" /> -->
		<ice:outputStyle id="outputStyle2" href="./xmlhttp/css/xp/xp.css"/>
        <link rel='stylesheet' type='text/css' href='../css/style.css' />
 
      </ice:outputHead>
	  <ice:outputBody style="background-color: #A9A9AB; font-size:0.9em; width:100%;" id="mybody">
		<!-- ============================== PANEL Group de la dataTable ========== -->
          <ice:panelGroup style="height : 500px; 
								 overflow: auto;
								 width : 100%;   ">
           <ice:form id="formTopBouton">
            <ice:dataTable  value="#{orderBook.rowDataModel}" var="order" id="table" rows="15" width="width :100%;" 
            		scrollable="false" >
 
              <ice:column>
				<f:facet name="header">
                  <ice:outputText value="Test column" />
                </f:facet>
              </ice:column>
              <ice:column>
				<f:facet name="header">
                  <ice:outputText value="Test column" />
                </f:facet>
              </ice:column>
              <ice:column>
				<f:facet name="header">
                  <ice:outputText value="Test column" />
                </f:facet>
              </ice:column>
			  <ice:column>
				<f:facet name="header">
                  <ice:outputText value="Test column" />
                </f:facet>
              </ice:column>
              <ice:column>
				<f:facet name="header">
                  <ice:outputText value="Test column" />
                </f:facet>
              </ice:column>
              <ice:column>
				<f:facet name="header">
                  <ice:outputText value="Test column" />
                </f:facet>
              </ice:column>
              <ice:column>
				<f:facet name="header">
                 <ice:outputText value="Test column" />
                </f:facet>
              </ice:column>
              <ice:column>
				<f:facet name="header">
                  <ice:outputText value="Test column" />
                </f:facet>
              </ice:column>
              <ice:column>
				<f:facet name="header">
                  <ice:outputText value="Test column" />
                </f:facet>
              </ice:column>
 
              <ice:column>
				<f:facet name="header">
                 <ice:outputText value="Test column" />
                </f:facet>
              </ice:column>
 
              <ice:column>
				<f:facet name="header">
                  <ice:outputText value="Test column" />
                </f:facet>
              </ice:column>
              <ice:column>
				<f:facet name="header">
                 <ice:outputText value="Test column" />
                </f:facet>
              </ice:column>
              <ice:column>
				<f:facet name="header">
                  <ice:outputText value="Test column" />
                </f:facet>
              </ice:column>
              <ice:column>
				<f:facet name="header">
                  <ice:outputText value="Test column" />
                </f:facet>
              </ice:column>
              <ice:column>
				<f:facet name="header">
                  <ice:outputText value="Test column" />
                </f:facet>
              </ice:column>
              <ice:column>
				<f:facet name="header">
                  <ice:outputText value="Test column" />
                </f:facet>
              </ice:column>
              <ice:column>
				<f:facet name="header">
                 <ice:outputText value="Test column" />
                </f:facet>
              </ice:column>
              <ice:column>
				<f:facet name="header">
                  <ice:outputText value="Test column" />
                </f:facet>
              </ice:column>
              <ice:column>
				<f:facet name="header">
                  <ice:outputText value="Test column" />
                </f:facet>
              </ice:column>
              <ice:column>
				<f:facet name="header">
                  <ice:outputText value="Test column" />
                </f:facet>
              </ice:column>
              <ice:column>
				<f:facet name="header">
                  <ice:outputText value="Test column" />
                </f:facet>
              </ice:column>
             <ice:column>
				<f:facet name="header">
                  <ice:outputText value="Test column" />
                </f:facet>
              </ice:column>
              <ice:column>
				<f:facet name="header">
                  <ice:outputText value="Test column" />
                </f:facet>
              </ice:column>
              <ice:column>
				<f:facet name="header">
                  <ice:outputText value="Test column" />
                </f:facet>
              </ice:column>
              <ice:column>
				<f:facet name="header">
                  <ice:outputText value="Test column" />
                </f:facet>
              </ice:column>              
            </ice:dataTable>
 
        </ice:form>
      </ice:panelGroup>
 
      </ice:outputBody>
    </ice:outputHtml>
  </f:view>
</jsp:root>
et voila la source généré.

Vous allez remarquer que ca contient deux balises <html> et deux <body>. Le premier et celui du template, l'autre est de la vue