diff --git a/aspnet/TreeView/Checkboxes.md b/aspnet/TreeView/Checkboxes.md index b4f40d57..be2d5ea8 100644 --- a/aspnet/TreeView/Checkboxes.md +++ b/aspnet/TreeView/Checkboxes.md @@ -1,13 +1,13 @@ --- title: Checkboxes in TreeView | TreeView | ASP.NET | Syncfusion -description: Specify checkboxes in TreeView and its settings +description: Learn here about specifying checkboxes in Syncfusion ASP.NET TreeView control, its settings and more. platform: aspnet control: TreeView documentation: UG keywords: TreeView, Syncfusion, ASP Web TreeView UG Doc, Checkboxes --- -# Checkboxes +# Checkboxes in ASP.NET TreeView Control TreeView consists of built-in checkbox option and it can be displayed to the left of the tree node by setting the **ShowCheckbox** property as true. It allows you to select more than one node at a time. @@ -80,7 +80,7 @@ You can use [isNodeChecked](https://help.syncfusion.com/api/js/ejtreeview#method ## Get Checked Nodes -To get checked nodes of TreeView, you can use [getCheckedNodes](http://help.syncfusion.com/js/api/ejtreeview#methods:getcheckednodes) method. It returns the collection of checked tree nodes. Also you can get currently checked nodes indexes in TreeView by using [getCheckedNodesIndex](https://help.syncfusion.com/api/js/ejtreeview#methods:getcheckednodesindex) method. +To get checked nodes of TreeView, you can use [getCheckedNodes](https://help.syncfusion.com/api/js/ejtreeview#methods:getcheckednodes) method. It returns the collection of checked tree nodes. Also you can get currently checked nodes indexes in TreeView by using [getCheckedNodesIndex](https://help.syncfusion.com/api/js/ejtreeview#methods:getcheckednodesindex) method. {% highlight html %} diff --git a/aspnet/TreeView/How-To.md b/aspnet/TreeView/How-To.md index a0f22cf3..86a7124f 100644 --- a/aspnet/TreeView/How-To.md +++ b/aspnet/TreeView/How-To.md @@ -1,17 +1,17 @@ --- title: How To | TreeView | ASP.NET | Syncfusion -description: How to do - section for TreeView +description: Learn here about how to do section for TreeView control in Syncfusion ASP.NET its elements, and more. platform: aspnet control: TreeView documentation: UG keywords: TreeView, Syncfusion, ASP Web TreeView UG Doc, How To --- -# How To +# How To in ASP.NET TreeView Control ## Update the modified data from tree to database. -TreeView allows us to get the updated tree data after performing such operation like node editing, drag and drop, add and remove node. Using [getTreeData](http://help.syncfusion.com/js/api/ejtreeview#methods:gettreedata) method you can get the updated tree data. +TreeView allows us to get the updated tree data after performing such operation like node editing, drag and drop, add and remove node. Using [getTreeData](https://help.syncfusion.com/api/js/ejtreeview#methods:gettreedata) method you can get the updated tree data. Refer the following code block to know how to get updated data from TreeView. @@ -292,12 +292,12 @@ Define menu events in the script as follows, The output for the context menu for TreeView control is as follows. -![http://help.syncfusion.com/aspnet/treeview/How-To_images/How-To_img1.png](How-To_images/How-To_img1.jpeg) +![Context menu output](How-To_images/How-To_img1.jpeg) ## Sorted data using refresh method -TreeView allows you to refresh the entire tree data using [refresh](http://help.syncfusion.com/js/api/ejtreeview#methods:refresh) method. Refer the below code block to know how to sort entire tree data using refresh method. +TreeView allows you to refresh the entire tree data using [refresh](https://help.syncfusion.com/api/js/ejtreeview#methods:refresh) method. Refer the below code block to know how to sort entire tree data using refresh method. In the code behind page, create a data list which contains the details about tree nodes and map the list data to DataSource property of TreeView. @@ -732,7 +732,7 @@ TreeView allows us to bind and update tree data in mapped data component while a ## Set tooltip for TreeView nodes -TreeView allows you to set tooltip option to TreeView nodes using [fields.linkAttribute](http://help.syncfusion.com/js/api/ejtreeview#members:fields-linkattribute) property of TreeView. Refer the below code block to know how to set tooltip for TreeView nodes. +TreeView allows you to set tooltip option to TreeView nodes using [fields.linkAttribute](https://help.syncfusion.com/api/js/ejtreeview#members:fields-linkattribute) property of TreeView. Refer the below code block to know how to set tooltip for TreeView nodes. In the code behind page, create a data list which contains the details about tree nodes and map the list data to DataSource property of TreeView. diff --git a/aspnet/TreeView/Template-Option.md b/aspnet/TreeView/Template-Option.md index 392c0c02..abfdf29f 100644 --- a/aspnet/TreeView/Template-Option.md +++ b/aspnet/TreeView/Template-Option.md @@ -1,6 +1,6 @@ --- title: Template Option| TreeView | ASP.NET | Syncfusion -description: Rendering TreeView using Template option +description: Rendering TreeView using Template option in Syncfusion ASP.NET TreeView control, its elements and more. platform: aspnet control: TreeView documentation: UG @@ -8,9 +8,9 @@ keywords: TreeView, Syncfusion, ASP Web TreeView UG Doc, Template Option --- -# Template Option +# Template Option in ASP.NET TreeView Control -Tree nodes can be customized by using '**Template**' property. Treeview template option requires addition JS library called '**JsRender**', which helps to create the structured way of tree nodes with simple codes and increased performance. To know more about JsRender - [http://www.jsviews.com/](http://www.jsviews.com/#). +Tree nodes can be customized by using '**Template**' property. Treeview template option requires addition JS library called '**JsRender**', which helps to create the structured way of tree nodes with simple codes and increased performance. To know more about JsRender - [https://www.jsviews.com/](https://www.jsviews.com/). In the code behind page, create a data list which contains the details about tree nodes and map the list data to DataSource property of TreeView. @@ -180,7 +180,7 @@ In the view page, specify template format and add TreeView element **Custom action in nodes** -You can able to perform custom action in TreeView template node. You can able to perform node delete operation while clicking delete icon by using [removeNode](http://help.syncfusion.com/js/api/ejtreeview#methods:removenode) method of TreeView as shown in below code example. +You can able to perform custom action in TreeView template node. You can able to perform node delete operation while clicking delete icon by using [removeNode](https://help.syncfusion.com/api/js/ejtreeview#methods:removenode) method of TreeView as shown in below code example. {% highlight html %} diff --git a/aspnet/TreeView/Tree-Node.md b/aspnet/TreeView/Tree-Node.md index 3f7f8043..71b687b4 100644 --- a/aspnet/TreeView/Tree-Node.md +++ b/aspnet/TreeView/Tree-Node.md @@ -1,13 +1,13 @@ --- title: Tree Node manipulation | TreeView | ASP.NET | Syncfusion -description: Handling node operations in TreeView +description: Learn here about handling node operations in Syncfusion ASP.NET TreeView control, its elementa and more. platform: aspnet control: TreeView documentation: UG keywords: TreeView, Syncfusion, ASP Web TreeView UG Doc, Tree Node --- -# Tree Node +# Tree Node in ASP.NET TreeView Control TreeView node is structured with expand/ collapse arrow, checkbox, image and text as shown in below. @@ -121,7 +121,7 @@ Selected state of the node TreeView provides a set of options to configure all its properties by setting and getting values at initialization or dynamically. -To get the node value, you can use [getNode](http://help.syncfusion.com/js/api/ejtreeview#methods:getnode) method as shown in the below code example, in which on button click action the node value has been retrieved. +To get the node value, you can use [getNode](https://help.syncfusion.com/api/js/ejtreeview#methods:getnode) method as shown in the below code example, in which on button click action the node value has been retrieved. Also you can get the text value of tree node by using [getText](https://help.syncfusion.com/api/js/ejtreeview#methods:gettext) method. In the code behind page, create a data list which contains the details about tree nodes and map the list data to the DataSource property of TreeView. @@ -194,9 +194,9 @@ In the ASPX page, specify following method in script tag to get node value of tr {% endhighlight %} -N>**Existing TreeView instance can be created by [jQuery.data()](http://api.jquery.com/jQuery.data/#) and you can control the API’s of TreeView behavior** +N>**Existing TreeView instance can be created by [jQuery.data()](https://api.jquery.com/jQuery.data/) and you can control the API’s of TreeView behavior** -To edit the node text, you can use [updateText](http://help.syncfusion.com/js/api/ejtreeview#methods:updatetext) method as shown in below code example. +To edit the node text, you can use [updateText](https://help.syncfusion.com/api/js/ejtreeview#methods:updatetext) method as shown in below code example. {% highlight html %} @@ -218,7 +218,7 @@ To edit the node text, you can use [updateText](http://help.syncfusion.com/js/ap ## Get Parent Node -To get current parent node of a particular node, you can use the [getParent](http://help.syncfusion.com/js/api/ejtreeview#methods:getparent) method as shown in below code example. +To get current parent node of a particular node, you can use the [getParent](https://help.syncfusion.com/api/js/ejtreeview#methods:getparent) method as shown in below code example. {% highlight html %} @@ -237,7 +237,7 @@ To get current parent node of a particular node, you can use the [getParent](htt ## Get Node Index -To get node index, you can use the [getNodeIndex](http://help.syncfusion.com/js/api/ejtreeview#methods:getnodeindex) as shown in below code example. +To get node index, you can use the [getNodeIndex](https://help.syncfusion.com/api/js/ejtreeview#methods:getnodeindex) as shown in below code example. You can use [getNodeByIndex](https://help.syncfusion.com/api/js/ejtreeview#methods:getnodebyindex) method to get TreeView node by using index position. @@ -265,7 +265,7 @@ You can perform following operation in tree nodes and the modified node values c ### Add or Remove nodes -To add/ remove nodes programmatically, use [addNode](http://help.syncfusion.com/js/api/ejtreeview#methods:addnode) and [removeNode](http://help.syncfusion.com/js/api/ejtreeview#methods:removenode) methods of the TreeView. +To add/ remove nodes programmatically, use [addNode](https://help.syncfusion.com/api/js/ejtreeview#methods:addnode) and [removeNode](https://help.syncfusion.com/api/js/ejtreeview#methods:removenode) methods of the TreeView. {% highlight javascript %} @@ -281,7 +281,7 @@ To add/ remove nodes programmatically, use [addNode](http://help.syncfusion.com {% endhighlight %} -You can able to add a new node after or before some TreeView node by using [insertAfter](http://help.syncfusion.com/js/api/ejtreeview#methods:insertafter) and [insertBefore](http://help.syncfusion.com/js/api/ejtreeview#methods:insertbefore) methods. +You can able to add a new node after or before some TreeView node by using [insertAfter](https://help.syncfusion.com/api/js/ejtreeview#methods:insertafter) and [insertBefore](https://help.syncfusion.com/api/js/ejtreeview#methods:insertbefore) methods. {% highlight javascript %} @@ -301,7 +301,7 @@ You can able to add a new node after or before some TreeView node by using [inse ### Move node -You can also achieve cut and paste operation by using [moveNode](http://help.syncfusion.com/js/api/ejtreeview#methods:movenode) method. +You can also achieve cut and paste operation by using [moveNode](https://help.syncfusion.com/api/js/ejtreeview#methods:movenode) method. {% highlight javascript %} @@ -329,7 +329,7 @@ Tree nodes can be expanded or collapsed by clicking the expand/ collapse icon of - {{'[expandNode](http://help.syncfusion.com/js/api/ejtreeview#methods:expandnode)'| markdownify }} + {{'[expandNode](https://help.syncfusion.com/api/js/ejtreeview#methods:expandnode)'| markdownify }} Expands the node with specified id @@ -337,7 +337,7 @@ Expands the node with specified id - {{'[collapseNode](http://help.syncfusion.com/js/api/ejtreeview#methods:collapsenode)'| markdownify }} + {{'[collapseNode](https://help.syncfusion.com/api/js/ejtreeview#methods:collapsenode)'| markdownify }} Collapse the node with specified id @@ -345,7 +345,7 @@ Collapse the node with specified id - {{'[expandAll](http://help.syncfusion.com/js/api/ejtreeview#methods:expandall)'| markdownify }} + {{'[expandAll](https://help.syncfusion.com/api/js/ejtreeview#methods:expandall)'| markdownify }} Expands all the node @@ -353,7 +353,7 @@ Expands all the node - {{'[collapseAll](http://help.syncfusion.com/js/api/ejtreeview#methods:collapseall)'| markdownify }} + {{'[collapseAll](https://help.syncfusion.com/api/js/ejtreeview#methods:collapseall)'| markdownify }} Collapse all the node @@ -361,11 +361,11 @@ Collapse all the node -Also you can get all the expanded nodes index in tree by using [getExpandedNodesIndex](http://help.syncfusion.com/js/api/ejtreeview#methods:getexpandednodesindex) method, which returns the array of expanded node indices. +Also you can get all the expanded nodes index in tree by using [getExpandedNodesIndex](https://help.syncfusion.com/api/js/ejtreeview#methods:getexpandednodesindex) method, which returns the array of expanded node indices. ### Prevent multiple node expand -You can able to prevent multiple expand of TreeView nodes by specifying [enableMultipleExpand](http://help.syncfusion.com/js/api/ejtreeview#members:enablemultipleexpand) as false. +You can able to prevent multiple expand of TreeView nodes by specifying [enableMultipleExpand](https://help.syncfusion.com/api/js/ejtreeview#members:enablemultipleexpand) as false. For example, if you want to allow only one node to be expanded in TreeView at a time. Refer the below code block for more details. @@ -385,7 +385,7 @@ For example, if you want to allow only one node to be expanded in TreeView at a ### Get updated node collection -You can get the updated node values after manipulating or editing the node of TreeView to save at server end by using [getTreeData](http://help.syncfusion.com/js/api/ejtreeview#methods:gettreedata) method. It returns the JSON data represented as in tree with modified structure. +You can get the updated node values after manipulating or editing the node of TreeView to save at server end by using [getTreeData](https://help.syncfusion.com/api/js/ejtreeview#methods:gettreedata) method. It returns the JSON data represented as in tree with modified structure. You can also get the updated data source for remote data binding after performing the operation like editing, selecting/unselecting, expanding/collapsing, checking/unchecking and removing node. You cannot get the updated data source when you perform operation like drag and drop, adding node for remote data binding. @@ -404,7 +404,7 @@ The updated data source also contains custom attributes if you return these from ## Editing -You can directly edit the tree node’s text in-place by double-click on the tree node or select the tree node and press F2 key. The editing works only if the [allowEditing](http://help.syncfusion.com/js/api/ejtreeview#members:allowediting) property is true in TreeView control. When editing is completed by focus out or “enter” key press, the modified node’s text is saved automatically. The [nodeEdit](https://help.syncfusion.com/api/js/ejtreeview#events:nodeedit) event will be triggered whenever edited the TreeView node. +You can directly edit the tree node’s text in-place by double-click on the tree node or select the tree node and press F2 key. The editing works only if the [allowEditing](https://help.syncfusion.com/api/js/ejtreeview#members:allowediting) property is true in TreeView control. When editing is completed by focus out or “enter” key press, the modified node’s text is saved automatically. The [nodeEdit](https://help.syncfusion.com/api/js/ejtreeview#events:nodeedit) event will be triggered whenever edited the TreeView node. Also [beforeEdit](https://help.syncfusion.com/api/js/ejtreeview#events:beforeedit) event will be triggered before the TreeView node change into editing mode. {% highlight html %} @@ -423,7 +423,7 @@ Also [beforeEdit](https://help.syncfusion.com/api/js/ejtreeview#events:beforeedi ## Selection -You can select a specific node by using [selectedNode](http://help.syncfusion.com/js/api/ejtreeview#members:selectednode) property or [selectNode](http://help.syncfusion.com/js/api/ejtreeview#methods:selectnode) method. To get the selected status of a given TreeView node you have to use [isSelected](https://help.syncfusion.com/api/js/ejtreeview#methods:isselected) method. +You can select a specific node by using [selectedNode](https://help.syncfusion.com/api/js/ejtreeview#members:selectednode) property or [selectNode](https://help.syncfusion.com/api/js/ejtreeview#methods:selectnode) method. To get the selected status of a given TreeView node you have to use [isSelected](https://help.syncfusion.com/api/js/ejtreeview#methods:isselected) method. The [nodeClick](https://help.syncfusion.com/api/js/ejtreeview#events:nodeclick) event will be triggered whenever TreeView node is clicked. The [beforeSelect](https://help.syncfusion.com/api/js/ejtreeview#events:beforeselect) event will be triggered before the TreeView node is selected. The [nodeSelect](https://help.syncfusion.com/api/js/ejtreeview#events:nodeselect)/[nodeUnselect](https://help.syncfusion.com/api/js/ejtreeview#events:nodeunselect) events will be triggered based on the TreeView node click operations.