ext中viewport问题？分三部分top west center其中west是菜单树，点击菜单会在center中显示其主要内容。。
1个回答
展开全部
<%@ Register Assembly="Coolite.Ext.Web" Namespace="Coolite.Ext.Web" TagPrefix="ext" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
<title></title>
<script type="text/javascript">
function GetTree(node) {
var eIdtd = document.getElementById("txtTitle");
var enumPare = document.getElementById("txtContent");
eIdtd.innerHTML ="编号："+ node.id;
enumPare.innerHTML ="内容："+ node.text;
}
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<ext:ScriptManager ID="ScriptManager1" runat="server">
</ext:ScriptManager>
<ext:ViewPort ID="ViewPort1" runat="server">
<Body>
<ext:BorderLayout ID="BorderLayout1" runat="server">
<North MarginsSummary="5 5 5 5">
<ext:Panel AllowDomMove="true" ID="Paneles" Height="250" runat="server" Title="top" Icon="Information" Header="true" Collapsed="true" Collapsible="true">
<Body>
<div style="float:left; white-space:normal; padding-left:5px; width:50%; vertical-align:middle; "><p>
导航：这是上边！
</p></div>
</Body>
</ext:Panel>
</North>
<West MinWidth="225" MaxWidth="400" Collapsible="true" Split="true" MarginsSummary="0 0 0 0" CMarginsSummary="0 0 0 0">
<ext:TreePanel ID="treePark" Header="false" Frame="false" Title="Tree" Width="300" Lines="false" BodyBorder="false"
RootVisible="false" runat="server">
<Root>
<ext:TreeNode Text="Composers" Expanded="true">
<Nodes>
<ext:TreeNode Text="Beethoven" Icon="UserGray">
<Nodes>
<ext:TreeNode Text="Concertos">
<Nodes>
<ext:TreeNode NodeID="1" Text="No. 1 - C" Icon="Music" />
<ext:TreeNode NodeID="2" Text="No. 2 - B-Flat Major" Icon="Music" />
<ext:TreeNode NodeID="3" Text="No. 3 - C Minor" Icon="Music" />
<ext:TreeNode NodeID="4" Text="No. 4 - G Major" Icon="Music" />
<ext:TreeNode NodeID="5" Text="No. 5 - E-Flat Major" Icon="Music" />
</Nodes>
</ext:TreeNode>
<ext:TreeNode Text="Quartets" >
<Nodes>
<ext:TreeNode NodeID="6" Text="Six String Quartets" Icon="Music" />
<ext:TreeNode NodeID="7" Text="Three String Quartets" Icon="Music" />
<ext:TreeNode NodeID="8" Text="Grosse Fugue for String Quartets" Icon="Music" />
</Nodes>
</ext:TreeNode>
<ext:TreeNode Text="Sonatas" >
<Nodes>
<ext:TreeNode Text="Sonata in A Minor" Icon="Music" />
<ext:TreeNode Text="sonata in F Major" Icon="Music" />
</Nodes>
</ext:TreeNode>
</Nodes>
</ext:TreeNode>
</Nodes>
</ext:TreeNode>
</Root>
<Listeners>
<Click Handler="Javascript:GetTree(node);" />
</Listeners>
</ext:TreePanel>
</West>
<Center>
<ext:Panel ID="panel1" Height="500px" BodyBorder="false" Frame="false" AutoScroll="true" runat="server">
<Body>
<table cellpadding="0" cellspacing="0" width="98%" border="0">
<tr>
<td height="20" colspan="2" >
<span style=" font-size:xx-large; text-align:center ">
这是中间部位
</span>
</td>
</tr>
<tr>
<td width="20" height="20" rowspan="2" align="center" valign="top">
</td>
<td style="height: 50px; vertical-align: bottom; overflow: scroll;" align="center">
<asp:Label ID="txtTitle" runat="server"></asp:Label>
</td>
</tr>
<tr>
<td align="left" id="txtContent1">
<asp:Label ID="txtContent" runat="server"></asp:Label>
</td>
</tr>
</table>
</Body>
</ext:Panel>
</Center>
</ext:BorderLayout>
</body>
</ext:ViewPort>
</div>
</form>
</body>
</html>
这个直接建一个页面，粘贴进去就可以用了！
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
<title></title>
<script type="text/javascript">
function GetTree(node) {
var eIdtd = document.getElementById("txtTitle");
var enumPare = document.getElementById("txtContent");
eIdtd.innerHTML ="编号："+ node.id;
enumPare.innerHTML ="内容："+ node.text;
}
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<ext:ScriptManager ID="ScriptManager1" runat="server">
</ext:ScriptManager>
<ext:ViewPort ID="ViewPort1" runat="server">
<Body>
<ext:BorderLayout ID="BorderLayout1" runat="server">
<North MarginsSummary="5 5 5 5">
<ext:Panel AllowDomMove="true" ID="Paneles" Height="250" runat="server" Title="top" Icon="Information" Header="true" Collapsed="true" Collapsible="true">
<Body>
<div style="float:left; white-space:normal; padding-left:5px; width:50%; vertical-align:middle; "><p>
导航：这是上边！
</p></div>
</Body>
</ext:Panel>
</North>
<West MinWidth="225" MaxWidth="400" Collapsible="true" Split="true" MarginsSummary="0 0 0 0" CMarginsSummary="0 0 0 0">
<ext:TreePanel ID="treePark" Header="false" Frame="false" Title="Tree" Width="300" Lines="false" BodyBorder="false"
RootVisible="false" runat="server">
<Root>
<ext:TreeNode Text="Composers" Expanded="true">
<Nodes>
<ext:TreeNode Text="Beethoven" Icon="UserGray">
<Nodes>
<ext:TreeNode Text="Concertos">
<Nodes>
<ext:TreeNode NodeID="1" Text="No. 1 - C" Icon="Music" />
<ext:TreeNode NodeID="2" Text="No. 2 - B-Flat Major" Icon="Music" />
<ext:TreeNode NodeID="3" Text="No. 3 - C Minor" Icon="Music" />
<ext:TreeNode NodeID="4" Text="No. 4 - G Major" Icon="Music" />
<ext:TreeNode NodeID="5" Text="No. 5 - E-Flat Major" Icon="Music" />
</Nodes>
</ext:TreeNode>
<ext:TreeNode Text="Quartets" >
<Nodes>
<ext:TreeNode NodeID="6" Text="Six String Quartets" Icon="Music" />
<ext:TreeNode NodeID="7" Text="Three String Quartets" Icon="Music" />
<ext:TreeNode NodeID="8" Text="Grosse Fugue for String Quartets" Icon="Music" />
</Nodes>
</ext:TreeNode>
<ext:TreeNode Text="Sonatas" >
<Nodes>
<ext:TreeNode Text="Sonata in A Minor" Icon="Music" />
<ext:TreeNode Text="sonata in F Major" Icon="Music" />
</Nodes>
</ext:TreeNode>
</Nodes>
</ext:TreeNode>
</Nodes>
</ext:TreeNode>
</Root>
<Listeners>
<Click Handler="Javascript:GetTree(node);" />
</Listeners>
</ext:TreePanel>
</West>
<Center>
<ext:Panel ID="panel1" Height="500px" BodyBorder="false" Frame="false" AutoScroll="true" runat="server">
<Body>
<table cellpadding="0" cellspacing="0" width="98%" border="0">
<tr>
<td height="20" colspan="2" >
<span style=" font-size:xx-large; text-align:center ">
这是中间部位
</span>
</td>
</tr>
<tr>
<td width="20" height="20" rowspan="2" align="center" valign="top">
</td>
<td style="height: 50px; vertical-align: bottom; overflow: scroll;" align="center">
<asp:Label ID="txtTitle" runat="server"></asp:Label>
</td>
</tr>
<tr>
<td align="left" id="txtContent1">
<asp:Label ID="txtContent" runat="server"></asp:Label>
</td>
</tr>
</table>
</Body>
</ext:Panel>
</Center>
</ext:BorderLayout>
</body>
</ext:ViewPort>
</div>
</form>
</body>
</html>
这个直接建一个页面，粘贴进去就可以用了！
本回答由提问者推荐
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
