Show theme settings Shopping cart Download trialFree Trial
Change Theme Settings
Change Theme Settings
Themes
 
Show All Themes
v
...v

Client-Side Functionality

  • Collapse
    Chemical elements
    • Collapse
      Metals
      • Alkali metals
      • Alkaline earth metals
      • Collapse
        Inner transition elements
        • Lanthanides
        • Actinides
      • Transition elements
      • Other metals
    • Metalloids
    • Collapse
      Nonmetals
      • Halogens
      • Noble gases
      • Other nonmetals
Options
v
Expand all
Collapse all

This example demonstrates how to manipulate the ASPxTreeView control programmatically on the client using our extended client-side functionality. The ASPxTreeView's client-side programmatic interface is available in the following cases:

This demo allows the selected node's settings to be modified on the client by clicking check boxes in the rightmost panel.

A node can be selected either directly within the ASPxTreeView control or by using the panel's dropdown editor. Note that the editor's dropdown window contains another ASPxTreeView control (created using a template) to make node selection easier. For synchronization purposes, the NodeClick client events of both ASPxTreeView controls are handled in an appropriate manner (using the OnTreeViewNodeClick function - for the leftmost ASPxTreeView, and using the OnNodesTreeViewNodeClick function - for the ASPxTreeView embedded into the editor's dropdown window).

In this demo, each tree view node is identified using the name assigned to its server Name property. So, any specific node can be easily obtained on the client using the GetNodeByName method of an ASPxTreeView.

Clicking check boxes invokes the corresponding client-side methods (SetEnabled, SetVisible, SetSelectedNode, SetChecked, or SetExpanded), to change the state of a node being currently selected.

A click on the 'Expand all' or 'Collapse all' button calls the respective client method (ExpandAll or CollapseAll) of the leftmost ASPxTreeView control.

Collapse/Expand
Local Copy of this Demo
To inspect the source code for this demo on your machine, you must first install our components via the DevExpress Component Installer.
You can open a local copy of this online demo directly from this webpage (if using v20.2.8, 21.1.4 or higher).
Open CS Solution
Open VB Solution
The source code files for this demo are installed (by default) in the following directories:
\Users\Public\Documents\DevExpress Demos XX.X\Components\ASP.NET\CS\ASPxNavigationAndLayoutDemos
\Users\Public\Documents\DevExpress Demos XX.X\Components\ASP.NET\VB\ASPxNavigationAndLayoutDemos