Feb 19, 2014, 2:17 PM
[CLOSED] Clicking on tree node moving the content in the screen towards left
Hi all,
Please run the below code in internet explorer 8, And also minimize the window/monitor width less than the treepanel width and click on any treepanel childnodes we displaying buttons , then we observed that the content in the screen is moving towards left, so we are unable to see the buttons.
Thanks
Mohan
Please run the below code in internet explorer 8, And also minimize the window/monitor width less than the treepanel width and click on any treepanel childnodes we displaying buttons , then we observed that the content in the screen is moving towards left, so we are unable to see the buttons.
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="TreeSample.aspx.cs" Inherits="EXT2._2.TreeSample" %>
<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<script type="text/javascript">
function getTreeNodeXY(TreeNode, Yvalue, toolBar, Xvalue) {
var x = toolBar.getY();
Xvalue.setValue(toolBar.getY());
var selectedNode = TreeNode.selModel.getSelection()[0],
view = TreeNode.getView();
Yvalue.setValue(Ext.fly(view.getNode(selectedNode)).getY());
}
</script>
<script runat="server">
protected void TreeNode_Select(object sender, DirectEventArgs e)
{
Int16 xValue = Convert.ToInt16(hdnXvalue.Text);
Int16 yValue = Convert.ToInt16(hdnYvalue.Text);
if (TreePanel1.SelectedNodes[0].NodeID == "1")
{
tbs.Height = (yValue - xValue) - 7;
btn1.Show();
btn2.Hide();
btn3.Hide();
btn4.Hide();
btn5.Hide();
}
else if (TreePanel1.SelectedNodes[0].NodeID == "2")
{
tbs.Height = (yValue - xValue) - 20;
btn1.Show();
btn2.Show();
btn3.Hide();
btn4.Hide();
btn5.Hide();
}
else if (TreePanel1.SelectedNodes[0].NodeID == "3")
{
tbs.Height = (yValue - xValue) - 33;
btn1.Show();
btn2.Show();
btn3.Show();
btn4.Hide();
btn5.Hide();
}
else if (TreePanel1.SelectedNodes[0].NodeID == "4")
{
tbs.Height = (yValue - xValue) - 46;
btn1.Show();
btn2.Show();
btn3.Show();
btn4.Show();
btn5.Hide();
}
else if (TreePanel1.SelectedNodes[0].NodeID == "5")
{
tbs.Height = (yValue - xValue) - 59;
btn1.Show();
btn2.Show();
btn3.Show();
btn4.Show();
btn5.Show();
}
else if (TreePanel1.SelectedNodes[0].NodeID == "6")
{
tbs.Height = (yValue - xValue) - 7;
btn1.Hide();
btn2.Hide();
btn3.Show();
btn4.Hide();
btn5.Hide();
}
else if (TreePanel1.SelectedNodes[0].NodeID == "7")
{
tbs.Height = (yValue - xValue) - 20;
btn1.Hide();
btn2.Show();
btn3.Hide();
btn4.Show();
btn5.Hide();
}
else if (TreePanel1.SelectedNodes[0].NodeID == "8")
{
tbs.Height = (yValue - xValue) - 33;
btn1.Show();
btn2.Hide();
btn3.Show();
btn4.Show();
btn5.Hide();
}
else if (TreePanel1.SelectedNodes[0].NodeID == "9")
{
tbs.Height = (yValue - xValue) - 20;
btn1.Show();
btn2.Hide();
btn3.Hide();
btn4.Hide();
btn5.Show();
}
}
</script>
<style type="text/css">
.tbstyle {
background-color: white;
background-image: none;
padding: 0px;
}
.tbs1 {
}
</style>
</head>
<body>
<form id="form1" runat="server">
<ext:ResourceManager ID="rmgr1" runat="server"></ext:ResourceManager>
<ext:Viewport ID="RDRAViewPort" runat="server" Layout="BorderLayout" IDMode="Explicit"
IsDynamic="False" Namespace="App" RenderXType="True">
<Items>
<ext:FormPanel ID="RDRAPanels" runat="server" Region="Center" Enabled="false" Header="false"
AutoScroll="true" Layout="FormLayout" ButtonAlign="Left" Title="" meta:resourcekey="RDRAPanelsResource1"
Padding="0">
<Items>
<ext:Panel ID="fieldRisk_container" runat="server" Title="<h3>Risk Assessment</h3>"
Collapsible="true" Layout="AutoLayout" meta:resourcekey="fieldRiskResource1"
TitleCollapse="true">
<Items>
<ext:Panel DisabledCls="ControlDisabled" ID="fieldRisk" Layout="FormLayout" Border="false"
runat="server" StyleSpec="padding-left:8px;">
<Items>
<ext:Container ID="LevelContainer1" runat="server" Layout="HBoxLayout">
<Items>
<ext:Toolbar ID="tb1" runat="server" Width="30" Cls="tbstyle" AutoScroll="true"
Vertical="true" Border="false">
<Items>
<ext:ToolbarSpacer ID="tbs" Width="30" runat="server" StyleSpec="padding:0px;margin:0px;background-color:white;"></ext:ToolbarSpacer>
<ext:Button ID="btn1" runat="server" Hidden="true" Icon="Accept" ToolTip="Collapse All" Height="24">
<Listeners>
<Click Handler="#{TreePanel1}.collapseAll();"></Click>
</Listeners>
</ext:Button>
<ext:Button ID="btn2" runat="server" Hidden="true" Icon="Add" Height="24" ToolTip="Expand All">
<Listeners>
<Click Handler="#{TreePanel1}.expandAll();"></Click>
</Listeners>
</ext:Button>
<ext:Button ID="btn3" runat="server" Hidden="true" Icon="Application" Height="24" ToolTip="Application">
</ext:Button>
<ext:Button ID="btn4" runat="server" Hidden="true" Icon="Bell" Height="24" />
<ext:Button ID="btn5" runat="server" Hidden="true" Icon="Bomb" Height="24" />
</Items>
</ext:Toolbar>
<ext:Container ID="LevelContainer" runat="server">
<Items>
<ext:Label ID="LabelTitle" runat="server" Text="HITRA Level" MarginSpec="0 0 0 10"
Width="70" Height="55" meta:resourcekey="LabelTitleResource1">
</ext:Label>
<ext:RadioGroup LabelSeparator="" ID="HIRARadioHIRALevel2" runat="server" ColumnsWidths="100,100"
MarginSpec="0 0 0 0" Layout="ColumnLayout">
<Items>
<ext:Radio ID="radioLevel1" runat="server" BoxLabel="Level 1" Checked="true" Cls="rbLevel"
InputValue="1" meta:resourcekey="radioLevel1Resource1" MarginSpec="0 0 0 10">
</ext:Radio>
<ext:Radio ID="radioLevel2" runat="server" BoxLabel="Level 2" Cls="rbLevel" InputValue="2"
meta:resourcekey="radioLevel2Resource1" MarginSpec="0 0 0 15">
</ext:Radio>
</Items>
</ext:RadioGroup>
<ext:TreePanel ID="TreePanel1" MinHeight="200" MultiSelect="false" runat="server"
StyleSpec="padding-left:7px;" RootVisible="false" Width="500" UseArrows="false"
Lines="true" EnableTheming="true" AutoScroll="true">
<Root>
<ext:Node>
<Children>
<ext:Node Text="To Do" Expanded="true">
<Children>
<ext:Node Text="Go jogging" NodeID="1" />
<ext:Node Text="Take a nap" Leaf="true" NodeID="2">
</ext:Node>
<ext:Node Text="Clean house" Leaf="true" NodeID="3" />
</Children>
</ext:Node>
<ext:Node Text="Grocery List" Icon="Folder" Expanded="true">
<Children>
<ext:Node Text="Bananas" NodeID="4" />
<ext:Node Text="Milk" Leaf="true" NodeID="5" />
<ext:Node Text="Cereal" Leaf="true" NodeID="6" />
</Children>
</ext:Node>
<ext:Node Text="Kitchen Remodel" Icon="Folder" Expanded="true">
<Children>
<ext:Node Text="Finish the budget" NodeID="7" />
<ext:Node Text="Call contractors" Leaf="true" NodeID="8" />
<ext:Node Text="Choose design" Leaf="true" NodeID="9" />
</Children>
</ext:Node>
</Children>
</ext:Node>
</Root>
<DirectEvents>
<Select OnEvent="TreeNode_Select" Before="getTreeNodeXY(#{TreePanel1},#{hdnYvalue},#{tb1},#{hdnXvalue})">
</Select>
</DirectEvents>
<SelectionModel>
<ext:TreeSelectionModel ID="tsmHazards" runat="server" Mode="Single"></ext:TreeSelectionModel>
</SelectionModel>
</ext:TreePanel>
</Items>
</ext:Container>
</Items>
</ext:Container>
</Items>
</ext:Panel>
</Items>
</ext:Panel>
</Items>
</ext:FormPanel>
</Items>
</ext:Viewport>
<ext:Hidden ID="hdnItem" runat="server">
</ext:Hidden>
<ext:Hidden ID="hdnYvalue" runat="server">
</ext:Hidden>
<ext:Hidden ID="hdnXvalue" runat="server">
</ext:Hidden>
</form>
</body>
</html>
Thanks
Mohan
Last edited by Daniil; Feb 25, 2014 at 3:46 AM.
Reason: [CLOSED]