SAPUI5 Tree control loading

[Former Member]

HI All,

Does anyone know if it is possible to instantiate and load a Tree control without first having to individually create all the nodes seperately setting their relationships each time?

Basially I'd like to be able to map an XML structure into a Tree control without first having to programatically pull it apart in order to create nodes.

There doesn't seem to be anything in the documentation.

Can I use aggregation somehow to perform this? This would seem to be the way that Table controls are created and filled.

So if I have some simple XML:

<?xml version="1.0"?>

<tree>

  <branch>

    <id>1</id>

    <name>Root Branch</name>

    <parentId>0</parentId>

  </branch>

  <branch>

    <id>2</id>

    <name>First Branch</name>

    <parentId>1</parentId>

  </branch>

  <branch>

    <id>3</id>

    <name>Second Branch</name>

    <parentId>1</parentId>

  </branch>

  <branch>

    <id>4</id>

    <name>First Sub Branch</name>

    <parentId>2</parentId>

  </branch>

</tree>

How can I read this in and create the interlinked nodes and Tree control that looks like:

Regards

Marty

[Former Member]

Alternatively a structure like this:

<?xml version="1.0"?>

<tree>

  <branch>

    <name>Root Branch</name>

    <branch>

      <name>First Branch</name>

      <branch>

        <name>First Sub Branch</name>

      </branch>

    </branch>

    <branch>

      <name>Second Branch</name>

    </branch>

  </branch>

</tree>

[former_member226851]

Hi Martin,

for example, If you have something like this:

<?xml version="1.0"?>
<tree>
  <branch name="Root Branch">
    <branch name="First Branch">
      <branch name="First Sub Branch">
      </branch>
    </branch>
    <branch name="Second Branch">
    </branch>
  </branch>
</tree>

You can simply use a template of node to bind values within tree control:

var oTree = new sap.ui.commons.Tree("tree");
var oNodeTemplate = new sap.ui.commons.TreeNode();
oNodeTemplate.bindProperty("text", "@name");
oTree.bindNodes("/", oNodeTemplate);

and the result will be exactly what you want to have (attachment).

If the names of branches on each levels in xml model have different names (not only "branch" and "name"), you can use factory functions to bind it. For instance, if you have XML file like this:

<?xml version="1.0"?>
<tree>
  <branch1 name1="Root Branch">
    <branch2 name2="First Branch">
      <branch3 name3="First Sub Branch">
      </branch3>
    </branch2>
    <branch2 name2="Second Branch">
    </branch2>
  </branch1>
</tree>

You can use this code to do the same thing as above:

var oTree = new sap.ui.commons.Tree("tree");
oTree.bindAggregation("nodes","/",function(sId,oContext){  
                     var treePath = oContext.getPath();  
                     var bindTextName = '';
                     if(treePath.indexOf("branch3") !== -1) {  
                               bindTextName = "@name3";                                  
                     }
                     else if(treePath.indexOf("branch2") !== -1){  
                               bindTextName = "@name2";                                
                     }  
                     else{
                               bindTextName = "@name1";  
                     }
                     return new sap.ui.commons.TreeNode().bindProperty("text",bindTextName); 
                    });  

I hope this will help you resolve your issue.

Best regards,

Tomasz