I have an AJAX enabled application that uses the WebTree and works well. However, I am adding search capability that requires the use of javascript on the client to react to a row onclick event on a table. I wrote a javascript function to handle the click event and search my tree to get to the correct node. However, I want to force a partial postback to that the UltraWebTree_NodeClick event is fired. I would think that using .NeedPostBack = true; would work, but nothing seems to happen. Please see my code below.
function SetNode(cat1, cat2, cat3){ var tree = igtree_getTreeById("UltraWebTree1"); var nodes = tree.getNodes(); for (var i = 0; i < nodes.length; i++){ if (nodes.getDataKey() == cat1){ nodes = nodes.getChildNodes(); for (var x = 0; x < nodes.length; x++){ if (nodes[x].getDataKey() == cat2){ nodes = nodes[x].getChildNodes(); for (var y = 0; y < nodes.length; y++){ if (nodes.getDataKey() == cat3){ //Found IT! nodes.setSelected(true); //Force the post back! tree.NeedPostBack = true; }; }; }; }; }; }; }
Ideally the user would not see the postback - it would be exactly as if the user had clicked on the themselves.
Thanks,
Rob
Hi Rob,
I would use the WARP panel in this scenario. Place the Tree in a WARP panel, and use the Warp's .refresh client-side function to force a partial refresh.
-Tony
I am trying to do a similar thing for part of my application, but shoehorning another panel in underneath the tree is going to be a significant effort. Is there any way to do a node.click(); or similar client function?
You can select a node from the client-side using the CSOM's tree.setSelectedNode method (http://help.infragistics.com/Help/NetAdvantage/NET/2008.1/CLR2.0/html/WebTree_Object_CSOM.html).
Setting the selected node is not having the same reaction (server method called) as clicking the node with the mouse.
Setting the selected node should fire the SelectedNodeChanged event on the server side.
Let's back up though. What functionality are you trying to acheive? What is the actual behavior you're trying to implement?
The server side logic is on NodeClicked (it would still be nice to have a node.click() ) .... not Selected Node Changed. Thats surely the problem here. Thanks for spelling it out.
Is the SelectedNodeChanged fired after the newly selected node has been set?
In the CSOM there is a setSelected method for the client-side Node object, but it indeed does not fire the postback event even if AutoPostBack is set to true, so it does not behave exactly like node.click().
The NodeSelectionChanged event handler on the server fires, the event argument e.Node is the newly selected node.
Yep, sounds good. Another way would be to use our CSOM and ig_getWebControlById(). It must be called to get the WARP control object before you call .refresh() on it. Calling refresh will update the whole WARP panel and all controls inside it.
Hope this helps.
if u want to do postback from client, you just can call __doPostBack() at your javascript function :P
i combine between WARP and __doPostBack on client, the idea is I wrap tree with WARP, at client clickEvent, i force postback using __doPostBack("treeId")
but it is not partial post back, it's full postback, however because I already wrap it in WARP, the screen didn't flick
I realize that my ideas maybe not too good, because I'm not using full advantage of WARP
Rumen Stankov"]In the CSOM there is a setSelected method for the client-side Node object, but it indeed does not fire the postback event even if AutoPostBack is set to true, so it does not behave exactly like node.click().
The javascript code is along these lines : http://tinyurl.com/6dn65y but actually the four last lines of the javascript function can be commented out without change in functioning.
------ EXAMPLE FOLLOWS-----
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><script runat="server"> protected void ButtonClick(object sender, EventArgs e) { throw new Exception(TreeView1.SelectedNode.Text); }</script><html xmlns="http://www.w3.org/1999/xhtml"><head id="Head1" runat="server"><title>Untitled Page</title><script type="text/javascript"> function TreeNodeClick(treeId, nodeId, button) { alert(treeId); var tree = igtree_getTreeById(treeId); tree.getNode(nodeId).setSelected(false); var nodes = tree.getNodes(); nodes[0].setSelected(true); tree.NeedPostBack = false; tree.CancelPostBack = true; event.cancelBubble = true; return true; } </script></head><body> <form id="form1" runat="server"> <div> <ignav:UltraWebTree runat="server" ID="TreeView1"> <ClientSideEvents NodeClick="TreeNodeClick" /> <Nodes> <ignav:Node Text="Node 1"></ignav:Node><ignav:Node Text="Node 2"></ignav:Node> <ignav:Node Text="Node 3"><Nodes><ignav:Node Text="Node 3.1"></ignav:Node></Nodes></ignav:Node> </Nodes> <AutoPostBackFlags NodeCollapsed="False" NodeExpanded="False" /> </ignav:UltraWebTree> <asp:Button ID="Button1" runat="server" OnClick="ButtonClick" Text="Button" UseSubmitBehavior="False" /></div> </form></body></html>