TreeViewFields

[Josef Szeliga]

I'm trying to understand how the treeviewModel works.

in the example found here http://help.syncfusion.com/aspnetmvc-classic/treeview/loadondemand

 

The following lines of code appear

 

    TreeViewFields treeViewFields = new TreeViewFields() { Id = "Id", ParentId = "ParentId", Text = "Text", ImageUrl = "ImageUrl", SpriteCSS = "SpriteCSS" };

 

There is no information on the site that i can find that mentions the TreeViewFields  class.

The line doesn't explain what is going on here.

1. What is the purpose of this object ?
2. Why are the property values being hard coded?
3. Whould these normally come from a data source ?

 

 

The control seems to have departed from the standard Windows/Microsoft treeview control and doesn't appear to employ the concepts Nodes or Leafs. 

Additoinal questoins are then;

1. How can you determine when the user clicks on an item in the tree view wether it is a Node ( has children) or a leaf (nothing sits underneath it) ?
2. Can icons be allocated differently for "Nodes" and "leafs"
3. Can the "Leaf" be expanded to hold additional information e.g. the url of a web address to call or an ID associated with it.

[Kasithangam C]

Hi Josef,

Thanks for contacting Syncfusion Support.

Query: 1 What is the purpose of this object? Why are the property values being hard coded? Whould these normally come from a data source?

In the online documentation link, we have rendered Treeview control by using two ways:

Through View

Through Model

When we render Treeview through view then you can directly bind Treeview fields and we don’t create this Treeview field object.When you are render Treeview control via TreeViewModel, you need to map the data member to the fileds properties to make the databinding.It doesn’t values hardcoded to the property.We have mapped the datamember fileds name to our Treeview fields property.Please find the below link to know the about the datamembers passed in Treeview fields:

http://help.syncfusion.com/cr/cref_files/aspnetmvc-classic/tools/topic7175.html

Query 2: How can you determine when the user clicks on an item in the tree view wether it is a Node ( has children) or a leaf (nothing sits underneath it) ?

We have a client side event “ClientSideOnNodeClick”, it triggers when the user click on an item in Treeview.You can determine the clicked node is Node or a leaf node from the click event argument as shown below code:

<code>

@(Html.Syncfusion().TreeView("myTreeView", "treeView", new { @class = "treeviewborder" })

         .Height(300).Width(230).ClientSideOnNodeClick("OnNodeClick"))

<script type="text/javascript">

    function OnNodeClick(sender, args) {

        var arr = args._target[0].childNodes;

        var msg=0

        for (var i = 0; i < arr.length; i++) {

            if (arr[i].nodeName == "UL")

                msg = 1;

        }

        if (msg == 1)

            alert("Node have childern");

        else

            alert("Its leaf node");

        }

</script>

</code>

Query 5: Can icons be allocated differently for "Nodes" and "leafs"

We have showcased icons to differentiate the Nodes and leafs in the below online sample link:

http://mvc.syncfusion.com/demos/ui/tools/TreeView/DragAndDrop#

Query 6: Can the "Leaf" be expanded to hold additional information e.g. the url of a web address to call or an ID associated with it.

We don’t pass the additional information to the leaf node.

We have an ejTreeview Control.We have provided more functionality in the ejTreeview control.Please refer the below online sample link for ejTreeview control:

http://js.syncfusion.com/demos/web/#!/azure/treeview/defaultfunctionalities

To know more about properties, methods, events of our Treeview Component, please refer to the following API link,

http://help.syncfusion.com/js/api/ejtreeview

Please go through the above links to know about the ejTreeview control.If you are going to use ejTreeView control, we will prepare the sample based on your requirement by using our ejTreeview control.

Please let us know if you have further query.

Regards,

Kasithangam