在webform中的devexpress aspxsplitter中套用了jquery-easyui的 tabs id=tt
<div id="tt" class="easyui-tabs" data-options="tools:'#tab-tools'" style="100%;height:100%">
</div>
在aspxsplitter调整大小等操作时,我们需要用代码调整tab的大小随splitter变化,使用ClientSideEvents-PaneExpanded等事件,如下:
<dx:ASPxSplitter ID="ASPxSplitter1" runat="server" Width="100%" Height="100%" ClientSideEvents-PaneExpanded="function(s, e) { $('#tt').resize(); } " ClientSideEvents-PaneCollapsed="function(s, e) { $('#tt').resize(); } " > <Styles> <SeparatorButton Border-BorderColor="Black" BorderBottom-BorderWidth="2" Border-BorderStyle="Solid" BorderTop-BorderWidth="1" BorderLeft-BorderWidth="1" BorderRight-BorderWidth="1" > <Border BorderColor="Black" BorderStyle="Solid" BorderWidth="0"></Border> <BorderBottom BorderWidth="2px"></BorderBottom> </SeparatorButton> </Styles> <Panes> <dx:SplitterPane Size="16%" ShowCollapseBackwardButton="True" > <PaneStyle> <Paddings Padding="2px"></Paddings> <Border BorderStyle="None"></Border> </PaneStyle> <ContentCollection> <dx:SplitterContentControl ID="SplitterContentControl1" runat="server"> <dx:aspxnavbar width="100%" datasourceid="XmlDataSource1" enableviewstate="False" font-size="9pt" id="ASPxNavBar1" runat="server" autocollapse="True" encodehtml="False" allowselectitem="True" GroupSpacing="0px" OnGroupDataBound="ASPxNavBar1_GroupDataBound" OnItemDataBound="ASPxNavBar1_ItemDataBound" Theme="Aqua" ItemLinkMode="ContentBounds" > <Paddings Padding="0px"></Paddings> <GroupHeaderStyle HorizontalAlign="Left" /> <ItemStyle HorizontalAlign="Left" /> <ClientSideEvents ItemClick="function(s, e) { SelectedItemChanged(e); }" /> <GroupDataFields TextField="TextField" NameField="NameField" /> <ItemDataFields ImageUrlField="ImageUrlField" NameField="NameField" TextField="TextField" ToolTipField="NavigateUrlField" /> </dx:aspxnavbar> <asp:XmlDataSource ID="XmlDataSource1" runat="server" DataFile="~/App_Data/navbardatasource - 复制.xml" XPath="/menu/*"></asp:XmlDataSource> </dx:SplitterContentControl> </ContentCollection> </dx:SplitterPane> <dx:SplitterPane> <PaneStyle> <Paddings Padding="2px"></Paddings> <Border BorderStyle="None"></Border> </PaneStyle> <ContentCollection> <dx:SplitterContentControl ID="SplitterContentControl2" runat="server"> <div style="height:10px;"> <dx:ASPxLabel runat="server" id="lblItems" ClientInstanceName="lblItems" ForeColor="Red"> </dx:ASPxLabel> </div> <div id="tt" class="easyui-tabs" data-options="tools:'#tab-tools'" style="100%;height:100%"> </div> <asp:ContentPlaceHolder ID="ContentPlaceHolder1" runat="server"> </asp:ContentPlaceHolder> </dx:SplitterContentControl> </ContentCollection> </dx:SplitterPane> </Panes> </dx:ASPxSplitter>