obout inc - Free ASP Treeview - Incredibly fast. Unlimited nodes. Very easy to use. Lots of features and examples. Cross-browser. - Server side events ASPTreeView Server-Side Events



The server-side events are being triggered using
the client-side events and our free AJAXPage control.

First you have to download the AJAXPage component.
Please visit the AJAXPage section for more information
about how to download and use the AJAXPage control.

You can also use our obout_Tree_DB component.
It allows you to update any changes in treeview
like adding/deleting nodes, editing, drag-and-drop, etc.
on server-side database automatically without writing code.



Enabling the events

To enable the server-side events,list the names of the events separated with commas
in the EventList property (no spaces).
Example:
    oTree.EventList = "OnNodeSelect,OnNodeDrop,OnAddNode";
    
Full list:
    oTree.EventList = "OnNodeSelect,OnNodeEdit,OnNodeDrop,OnAddNode,OnRemoveNode,
        OnNodeExpand,OnNodeCollapse,OnBeforeNodeEdit,OnBeforeAddNode,
        OnBeforeRemoveNode,OnBeforeDrop,OnMoveNodeUp,OnMoveNodeDown";
    


Sending the data to the server-side events

All the events use the AJAXPage control to post data to the server
(without reloading the page) and return the result to the client.

A set of parameters is being sent for each event. To change the name
or these parameters or to use the result returned from the server
you have to open the ob_events_xxxx.js file and edit the
events you need.

For example, the ob_OnNodeEdit function, which is executed every time
a node is edited:
    function ob_OnNodeEdit(id, text, prevText)
    {    
        // add client side code here
        //alert("OnNodeEdit on " + id + "\n  text: " + text + "\n prevText: " + prevText);      
        if(ob_ev("OnNodeEdit"))
        {
            if(typeof ob_post != "undefined")
            {
                ob_post.AddParam("id", id);
                ob_post.AddParam("text", text);
                ob_post.AddParam("prevText", prevText);
                //Change "TreeEvents.aspx" with the name of your server-side processing file
                var sResult = ob_post.post("TreeEvents.aspx", "OnNodeEdit");
                
                //use the result returned from the server:
                alert(sResult);
            }
            else
            {
                alert("You have to add the AJAXPage control to your page in order to use the server-side events!");
            } 
        } 
    }
   
There are 3 parameters that will be sent to the server: id, text and prevText
You can use the result returned from the server into your client-side functions.


Implementing the server-side methods

Each event needs to have a corresponding server-side method, that will be executed
when the event is triggered. These methods are declared in the server-side processing file
(TreeEvents.aspx in our example) and must have the same name as the event
and their arguments must be the same as the ones specified on the client-side.
For example, the OnNodeEdit method:
    public string OnNodeEdit(string id, string text, string prevText)
    {
        return "This is the server response: for OnNodeEdit";
    }
    
The value returned by the server-side methods will be available on the client-side
(this is what the ob_post.post function returns)


"We’re very happy customers. Thanks for the great turnaround time and attention with your tech support.Thanks."

Chris LoPresto
Microdesk, Inc.

Random testimonial   All testimonials

obout.com
obout.com Home
News
TreeView Home
TreeView Home
Download
Site Map
Examples 
Styles
Classic
Classic
Dynamic Loading
No Icons
Black
Black No Icons
Background image
Premiere New
black
blue
green
red
violet
yellow
Explorer
Gray
Help
HelpPlus
MSDN
TMenu
TMenu (small icons)
Vista New
Web
White
XPBlue
Win2003
Right To Left
Features
Drag and drop - 18
Drag-n-Drop
Custom
Multi-node
Dragging with children
Drop in textboxes
External D'n'D
Move nodes 1
Renumber nodes
Auto Scrolling
Copy / Move nodes
D'n'd and Dynamic Loading
Drop in listboxes
Drop in listboxes 2
Restrict Levels
D'n'D with various options
Disable dropping in two trees
Not-allowed Icon New
Sort after D'n'D New
Dynamic loading - 6
Web style
MSDN style
Deep tree
Reload subtrees
Loading trees partially
Virtual Scrolling New
Add/remove nodes - 4
Add/remove on client-side
Alphabetical order
Add to dynamic subtrees
Remove all children
Edit nodes - 4
Edit nodes
Nodes with Checkboxes
Sort after Edit New
Select nodes - 3
Find selected node
Select multiple nodes
Highlight parent
Layout - 2
Width, height and scrollbars
Root node
TreeView state - 3
Dynamic
Keep expanded
Keep collapsed
File system - 3
Show file system
File system loading
File system manager
Additional data for each node - 3
Details
On client side
Image viewer
Expand/collapse nodes - 2
By level
Single folder
Multiple trees - 4
Two Trees
Two Trees custom
Two Trees enhancement
Move Nodes BTWN Trees New
Different Styles New
Validation - 2
D-n-d on server
Edit on server
Integration - 14
With a context menu
Attach Easy Menu
Attach menu on-demand
Attach to dynamic nodes
Attach menu to icons
Change icons
With Flyout
With Splitter
MS AJAX
With checkboxes
Dynamic checkboxes
With a Combobox
With modal dialog
Outlook Slide Menu
With Tab Strip
Build from SiteMap
Customization - 7
Icons for treeview
Aligned columns
CSS Tutorial
Hover node effect
Multi-Level Slide Menu
Select on Collapse
From Dennis
From/To XML file
Keyboard navigation
Search nodes
Client-side events
Knowledge Base - 1
Knowledge Base
Documentation
Method Add
Server-Side
Client-Side
Client-Side Events
XML
Methods
XML Tutorial
Client-Side Tutorial
Tutorial 1
Tutorial 2
Tutorial 3
Tutorial 4
Events
Tutorial
Event handlers
Tutorials
Using the correct path
Improving performance
In a user control
AutoPostBack with various options
Open in Search pane
Move nodes by clicking a button
Postback on node select
Switch icons