Insertion d'un scrollbar dans un TabContainer

**stefsas** · 14/06/2010, 12h24

Bonjour,

J'ai un TabContainer dans lequel j'ai une zone zoneBoxCriteresReferencement.
Celle-ci contient deux autres zones zoneBoxSelectionsPossibles et zoneBoxVosSelections côte à côte.

La première zone zoneBoxSelectionsPossibles contient un Treeview et a une taille qui s'ajuste en fonction du déploiement de l'arbre.

Mon problème est que ma deuxième zone zoneBoxVosSelections va se mettre en dessous.
Ce que je voudrais, c'est insérer un scrollbar à mon TabContainer lorsque cela est nécéssaire afin que les deux zones zoneBoxSelectionsPossibles et zoneBoxVosSelections restent côte à côte lorsque l'arbre est déployé.

Voici mon code, si quelqu'un voit comment faire, merci.

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
<asp:TabContainer ID="TabContainer1" runat="server" ActiveTabIndex="0"  CssClass="ajax__tab_yuitabview-theme" >
 
            <asp:TabPanel ID="TabPanel1" runat="server" HeaderText="Données de détection">
                <ContentTemplate>
 
 
<div id="zoneBoxCriteresReferencement">
 
  <div id="boitelibelleCriteresReferencement">
        <asp:Panel ID="CriteresReferencement" runat="server" style="background: #A8C1DF; width:220px ;text-align:center; color:#F7FBFA" >  Critères de référencement  </asp:Panel>
   </div> 
       <asp:RoundedCornersExtender ID="RoundedCornersExtender3" TargetControlID="CriteresReferencement" Corners="Top" Radius="6" runat="server"> </asp:RoundedCornersExtender>
 
    <asp:Panel ID="Panel1" runat="server" ScrollBars="auto">
 
 
 <div id="boiteCriteresReferencement">
 
     <asp:Panel ID="Panel2" runat="server" ScrollBars="Auto">
 
 
      <div id="zoneBoxSelectionsPossibles">
 
      <div id="boitelibelleSelectionsPossibles">
        <asp:Panel ID="SelectionsPossibles" runat="server" style="background: #A8C1DF; width:180px ;text-align:center; color:#F7FBFA" >  Sélections possibles  </asp:Panel>
     </div> 
       <asp:RoundedCornersExtender ID="RoundedCornersExtender4" TargetControlID="SelectionsPossibles" Corners="Top" Radius="6" runat="server"> </asp:RoundedCornersExtender>
 
  <div id="boiteSelectionsPossibles">
      <asp:Panel ID="PanelSelectionsPssibles" runat="server" >
 
   <asp:TreeView ID="ReferencesNominatives" runat="server" ImageSet="Simple" 
           NodeIndent="10" >
        <ParentNodeStyle Font-Bold="False" />
        <HoverNodeStyle Font-Underline="True" ForeColor="#DD5555" />
        <SelectedNodeStyle Font-Underline="True" ForeColor="#DD5555" 
            HorizontalPadding="0px" VerticalPadding="0px" />
        <NodeStyle Font-Names="Verdana" Font-Size="8pt" ForeColor="Black" 
            HorizontalPadding="0px" NodeSpacing="0px" VerticalPadding="0px" />
    <Nodes >
      <asp:TreeNode Text="Références nominatives"  NavigateUrl="" Expanded="False">
...
      </asp:TreeNode>
    </Nodes>
 
    </asp:TreeView>
  </asp:Panel>
  </div> <%-- Fin de boiteSelectionsPossibles --%>
 
   </div> <%-- Fin de zoneBoxSelectionsPossibles --%>
 
 
<div id="zoneBoxVosSelections">
 
     <div id="boitelibelleVosSelections">
 
 
        <asp:Panel ID="VosSelections" runat="server" style="background: #A8C1DF; width:180px ;text-align:center; color:#F7FBFA" >  Vos sélections  </asp:Panel>
     </div> 
       <asp:RoundedCornersExtender ID="RoundedCornersExtender5" TargetControlID="VosSelections" Corners="Top" Radius="6" runat="server"> </asp:RoundedCornersExtender>
 
   <div id="boiteVosSelections">
 
       <asp:Panel ID="PanelVosSelections" runat="server" Height="300px" ScrollBars="Auto"></asp:Panel>
 
   </div> <%-- Fin de boiteVosSelections --%>
 
  </div> <%-- Fin de zoneBoxVosSelections --%>
</asp:Panel>
 
</div> <%-- Fin de boiteCriteresReferencement --%>
 
</asp:Panel>
 
</div> <%-- Fin de zoneBoxCriteresReferencement --%>
 
                 </ContentTemplate>
            </asp:TabPanel>
 
        </asp:TabContainer>

Code CSS :

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
#zoneBoxCriteresReferencement
{
 position:relative;
 width:99%;
 margin-top: 10px;
} 
 
 
#zoneBoxSelectionsPossibles,#zoneBoxVosSelections
{
 float:left;
 width:auto;
 min-width:290px;
 margin-top: 10px;  
 margin-left:10px;
}
 
/*Partie CritèresReferencement*/
#boiteCriteresReferencement
{ 
 float:left;      
 width:98.1%;
 border: 1px solid #C2C4C6;
 padding: 5px;
 margin-left:1px;  
 background: #DEE2EA;   
}  
 
 
#boiteSelectionsPossibles,#boiteVosSelections
{
 min-width:275px;
 width:auto;
 min-height:300px;
 border: 1px solid #C2C4C6;
 padding: 5px;
 margin-left:1px;  
 background: #ECEBEF; 
}

**jacky01** · 14/06/2010, 12h29

Bonjour,

Si tu rajoute un panel contenant zoneBoxSelectionsPossibles et zoneBoxVosSelections avec ScrollBars = "Auto" ça fonctionnerais pas ?

du genre :

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
<asp:TabContainer ID="TabContainer1" runat="server" ActiveTabIndex="0"  CssClass="ajax__tab_yuitabview-theme" >
 
            <asp:TabPanel ID="TabPanel1" runat="server" HeaderText="Données de détection">
                <ContentTemplate>
 
 <asp:Panel ID="Panel" runat="server" ScrollBars="Auto" >
<div id="zoneBoxCriteresReferencement">
 
  <div id="boitelibelleCriteresReferencement">
        <asp:Panel ID="CriteresReferencement" runat="server" style="background: #A8C1DF; width:220px ;text-align:center; color:#F7FBFA" >  Critères de référencement  </asp:Panel>
   </div> 
       <asp:RoundedCornersExtender ID="RoundedCornersExtender3" TargetControlID="CriteresReferencement" Corners="Top" Radius="6" runat="server"> </asp:RoundedCornersExtender>
 
    <asp:Panel ID="Panel1" runat="server" ScrollBars="auto">
 
 
 <div id="boiteCriteresReferencement">
 
     <asp:Panel ID="Panel2" runat="server" ScrollBars="Auto">
 
 
      <div id="zoneBoxSelectionsPossibles">
 
      <div id="boitelibelleSelectionsPossibles">
        <asp:Panel ID="SelectionsPossibles" runat="server" style="background: #A8C1DF; width:180px ;text-align:center; color:#F7FBFA" >  Sélections possibles  </asp:Panel>
     </div> 
       <asp:RoundedCornersExtender ID="RoundedCornersExtender4" TargetControlID="SelectionsPossibles" Corners="Top" Radius="6" runat="server"> </asp:RoundedCornersExtender>
 
  <div id="boiteSelectionsPossibles">
      <asp:Panel ID="PanelSelectionsPssibles" runat="server" >
 
   <asp:TreeView ID="ReferencesNominatives" runat="server" ImageSet="Simple" 
           NodeIndent="10" >
        <ParentNodeStyle Font-Bold="False" />
        <HoverNodeStyle Font-Underline="True" ForeColor="#DD5555" />
        <SelectedNodeStyle Font-Underline="True" ForeColor="#DD5555" 
            HorizontalPadding="0px" VerticalPadding="0px" />
        <NodeStyle Font-Names="Verdana" Font-Size="8pt" ForeColor="Black" 
            HorizontalPadding="0px" NodeSpacing="0px" VerticalPadding="0px" />
    <Nodes >
      <asp:TreeNode Text="Références nominatives"  NavigateUrl="" Expanded="False">
...
      </asp:TreeNode>
    </Nodes>
 
    </asp:TreeView>
  </asp:Panel>
  </div> <%-- Fin de boiteSelectionsPossibles --%>
 
   </div> <%-- Fin de zoneBoxSelectionsPossibles --%>
 
 
<div id="zoneBoxVosSelections">
 
     <div id="boitelibelleVosSelections">
 
 
        <asp:Panel ID="VosSelections" runat="server" style="background: #A8C1DF; width:180px ;text-align:center; color:#F7FBFA" >  Vos sélections  </asp:Panel>
     </div> 
       <asp:RoundedCornersExtender ID="RoundedCornersExtender5" TargetControlID="VosSelections" Corners="Top" Radius="6" runat="server"> </asp:RoundedCornersExtender>
 
   <div id="boiteVosSelections">
 
       <asp:Panel ID="PanelVosSelections" runat="server" Height="300px" ScrollBars="Auto"></asp:Panel>
 
   </div> <%-- Fin de boiteVosSelections --%>
 
  </div> <%-- Fin de zoneBoxVosSelections --%>
</asp:Panel>
 
</div> <%-- Fin de boiteCriteresReferencement --%>
 
</asp:Panel>
 
</div> <%-- Fin de zoneBoxCriteresReferencement --%>
 </panel>
                 </ContentTemplate>
            </asp:TabPanel>
 
        </asp:TabContainer>

**stefsas** · 14/06/2010, 16h47

Non ça ne change rien.

Insertion d'un scrollbar dans un TabContainer

ASP.NET

Discussions similaires

Partager

Partager