[CLOSED] TreePanel + Listeners + Click/BeforeClick
I noticing that Click and BeforeClick on the TreePanel have the same behavior. I don't know if this is an ExtJS problem or a Coolite problem.
Here is some code to demonostrate the problem. Here is the .aspx page:
Code:
<script language="javascript" type="text/javascript">
var PanelEvents = {
getSelectModel: function(panelName)
{
try {
var panel = Ext.getCmp(panelName);
alert(panel.selModel.getSelectedNode().id);
} catch(err) {
Ext.Msg.alert('Javascript Error', err.description);
}
}
}
</script>
<ext:TreePanel ID="tpPanel" runat="server" AutoScroll="true" Border="false" RootVisible="false" IDMode="Static">
<Loader>
<ext:PageTreeLoader OnNodeLoad="tpPanel_NodeLoad" />
</Loader>
<Listeners>
<Click Handler="PanelEvents.getSelectModel('tpPanel');" />
</Listeners>
</ext:TreePanel>
Here is the code behind:
Code:
protected void Page_Load(object sender, EventArgs e)
{
if (!this.IsPostBack && !Ext.IsAjaxRequest)
{
this.BuildUsersTree();
}
}
protected void tpPanel_NodeLoad(object sender, NodeLoadEventArgs e)
{
if (!string.IsNullOrEmpty(e.NodeID))
{
// Do some stuff here
}
}
private void BuildUsersTree()
{
IntUsers.Users user = new IntUsers.Users(this.ConnectionString);
DataTable users = user.GetUsers();
TreeNode nodeUsers = new TreeNode("Users", Icon.Group);
tpPanel.Users.Add(nodeUsers);
if (users != null && users.Rows.Count > 0)
{
foreach(DataRow data in users.Rows)
{
string fullName = Convert.ToString(data["FullName"]);
string userId = Convert.ToString(data["UserId"]);
bool isOnline = Convert.ToBoolean(data["IsOnline"]);
Icon statusIcon = (isOnline) ? Icon.StatusOnline : Icon.StatusOffline;
AsyncTreeNode userNode = new AsyncTreeNode("ur" + userId, fullName);
userNode.Icon = statusIcon;
nodeUsers.Nodes.add(userNode);
}
}
}
Now, the problem is that the selectedNode() isn't available on the Click listener at this point. It's excibiting the same behavior as a BeforeClick listener.
If I fire the Click listener event, then I how am I suppose to get the currently selected node (or it's id)?
Thanks.
RE: [CLOSED] TreePanel + Listeners + Click/BeforeClick
By the way, I do know about passing "node" from the call to the function.
However, we are using this in various ways (other than just a call from Click) and we need to pull the selectionModel instead of the node.
Thanks.
RE: [CLOSED] TreePanel + Listeners + Click/BeforeClick
Hi state,
The first parameter sent to the .Handler for both <BeforeClick> and <Click> is an instance of the 'node'.
Example
Code:
<%@ Page Language="C#" %>
<%@ 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 id="Head1" runat="server">
<title></title>
</head>
<body>
<form id="form1" runat="server">
<ext:ScriptManager runat="server" />
<ext:TreePanel ID="TreePanel1" runat="server" Height="300" Width="185" Title="Tree">
<Root>
<ext:TreeNode Text="Item1" Expanded="true">
<Nodes>
<ext:TreeNode Text="Item2" />
<ext:TreeNode Text="Item3" />
</Nodes>
</ext:TreeNode>
</Root>
<Listeners>
<BeforeClick Handler="console.log('BeforeClick', node);" />
<Click Handler="console.log('Click', node);" />
</Listeners>
</ext:TreePanel>
</form>
</body>
</html>
Hope this helps.
RE: [CLOSED] TreePanel + Listeners + Click/BeforeClick
I don't know if Coolite supports a multiple select model in the TreePanel.
So, how would this be handled in that case? Does the Click/BeforeClick pass back an array of selected nodes?
RE: [CLOSED] TreePanel + Listeners + Click/BeforeClick
There is MultiSelectionModel functionality, but we have yet to implemented this server-side.
The following sample demonstrates how you can manually configure the MultiSelectionModel.
Example
Code:
<ext:TreePanel ID="TreePanel1" runat="server" Height="300" Width="185" Title="Tree">
<Root>
<ext:TreeNode Text="Item1" Expanded="true">
<Nodes>
<ext:TreeNode Text="Item2" />
<ext:TreeNode Text="Item3" />
</Nodes>
</ext:TreeNode>
</Root>
<CustomConfig>
<ext:ConfigItem Name="selModel" Value="new Ext.tree.MultiSelectionModel()" Mode="Raw" />
</CustomConfig>
<Listeners>
<BeforeClick Handler="console.log('BeforeClick', node);" />
<Click Handler="console.log('Click', node);" />
</Listeners>
</ext:TreePanel>
The BeforeClick and Click events are fired when each node is clicked (selected).