Aug 02, 2011, 12:26 PM
How to expand the DropDownField on DocumentReady?
I tried to use the dropdownField.expand() function to open the dropdown list during the DocumentReady event but this function does not seem to work (i'm not sure either if the method is really working for other events). Did this for both a static and dynamically added dropDownField control, but no avail.
Is there another function that I can use to accomplish this?
Is there another function that I can use to accomplish this?
<%@ Page Language="C#" AutoEventWireup="true" %>
<%@ Import Namespace="Ext.Net" %>
<!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 runat="server">
TreePanel tree;
DropDownField dropBussLine;
protected void Page_Init(object sender, EventArgs e)
{
tree = new TreePanel() {
ID = "treeBusinessLine",
Height = 300,
Width = 220,
AutoScroll = true,
RootVisible = true,
};
dropBussLine = new DropDownField() {
ID = "businessline",
Width = 150,
Editable = false,
IDMode = IDMode.Explicit,
};
dropBussLine.Component.Add(tree);
dropBussLine.Listeners.TriggerClick.Handler = "";
dropBussLine.Listeners.Expand.Handler = "this.component.getRootNode().expand(true);";
dropBussLine.Listeners.Expand.Single = true;
dropBussLine.Listeners.Expand.Delay = 10;
tbar.Items.Insert(0, new Ext.Net.Label("Business Line:"));
tbar.Items.Insert(1, dropBussLine);
tbar.Items.Insert(2, new ToolbarSeparator());
}
protected void Page_Load(object sender, EventArgs e)
{
var root = new Ext.Net.TreeNode("Essilor");
tree.Root.Add(root);
root.Nodes.Add(new Ext.Net.TreeNode {
Text = "Test"
});
}
</script>
<script type="text/javascript">
var onload = function () {
/*
var ps = [];
for (var p in businessline)
ps.push(p);
ps.sort();
alert(ps.join(', '));
*/
//businessline.expand();
Field3.expand();
};
</script>
</head>
<body>
<form runat="server">
<ext:ResourceManager runat="server">
<Listeners>
<DocumentReady Handler="onload();" />
</Listeners>
</ext:ResourceManager>
<ext:Viewport runat="server" Layout="Border">
<Items>
<ext:Panel ID="header" runat="server" Region="North">
<TopBar>
<ext:Toolbar ID="tbar" runat="server">
<Items>
<ext:ComboBox ID="cboDateScope" runat="server" Editable="false" Width="70" SelectedIndex="1">
<Items>
<ext:ListItem Text="Active" Value="active" />
<ext:ListItem Text="All" Value="all" />
</Items>
</ext:ComboBox>
<ext:ToolbarSeparator ID="ToolbarSeparator1" runat="server" />
<ext:Button ID="btnExportResult" runat="server" Text="Export" />
<ext:DropDownField ID="Field3" runat="server" Editable="false" Width="300" TriggerIcon="SimpleArrowDown">
<Component>
<ext:TreePanel ID="TreePanel1" runat="server" Title="My Task List" Icon="Accept"
Height="300" Shadow="None" UseArrows="true" AutoScroll="true" Animate="true"
EnableDD="true" ContainerScroll="true" RootVisible="false">
<Root>
<ext:TreeNode>
<Nodes>
<ext:TreeNode Text="To Do" Icon="Folder">
<Nodes>
<ext:TreeNode Text="Go jogging" Leaf="true" Checked="False" />
<ext:TreeNode Text="Take a nap" Leaf="true" Checked="False" />
<ext:TreeNode Text="Clean house" Leaf="true" Checked="False" />
</Nodes>
</ext:TreeNode>
<ext:TreeNode Text="Grocery List" Icon="Folder">
<Nodes>
<ext:TreeNode Text="Bananas" Leaf="true" Checked="False" />
<ext:TreeNode Text="Milk" Leaf="true" Checked="False" />
<ext:TreeNode Text="Cereal" Leaf="true" Checked="False" />
<ext:TreeNode Text="Energy foods" Icon="Folder">
<Nodes>
<ext:TreeNode Text="Coffee" Leaf="true" Checked="False" />
<ext:TreeNode Text="Red Bull" Leaf="true" Checked="False" />
</Nodes>
</ext:TreeNode>
</Nodes>
</ext:TreeNode>
<ext:TreeNode Text="Kitchen Remodel" Icon="Folder">
<Nodes>
<ext:TreeNode Text="Finish the budget" Leaf="true" Checked="False" />
<ext:TreeNode Text="Call contractors" Leaf="true" Checked="False" />
<ext:TreeNode Text="Choose design" Leaf="true" Checked="False" />
</Nodes>
</ext:TreeNode>
</Nodes>
</ext:TreeNode>
</Root>
<Buttons>
<ext:Button ID="Button1" runat="server" Text="Close">
<Listeners>
<Click Handler="#{Field3}.collapse();" />
</Listeners>
</ext:Button>
</Buttons>
<Listeners>
<CheckChange Handler="this.dropDownField.setValue(getTasks(this), false);" />
</Listeners>
</ext:TreePanel>
</Component>
<Listeners>
<Expand Handler="this.component.getRootNode().expand(true);" Single="true" Delay="10" />
</Listeners>
</ext:DropDownField>
</Items>
</ext:Toolbar>
</TopBar>
</ext:Panel>
<ext:Panel runat="server" Region="Center" Html="<p>Hello World.</p>">
</ext:Panel>
</Items>
</ext:Viewport>
</form>
</body>
</html>
