Search code examples
treeviewliferay-aui

AUI TreeView execute code after render


After I render tree view I want to execute some code. But only after render is complete. It seems like AUI renders nodes of tree asynchronously. Is there an event or param to run a function after render()? This makes me think that TreeView is being drawn async.

var render = new Y.TreeView(
          {
            boundingBox: '#fruits',             
            children: [              
              {
                children: [
                  {label: 'Watermelon', leaf: true},
                  {label: 'Apricot', leaf: true},                     
                  {
                        children: [
                          {label: 'Watermelon', leaf: true},
                          {label: 'Apricot', leaf: true},                             
                          {
                                children: [
                                  {label: 'Watermelon', leaf: true},
                                  {label: 'Apricot', leaf: true},                                     
                                  {label: 'Pomegranate', leaf: true}
                                ],
                                expanded: true,
                                label: 'second branch',
                                type: 'task'
                              }
                        ],
                        expanded: true,
                        label: 'second branch'
                      }
                ],
                expanded: true,
                label: 'first branch'
              },
              {
                children: [
                  {label: 'Watermelon', leaf: true},
                  {label: 'Apricot', leaf: true}                     
                ],
                expanded: true,
                label: 'second branch'
              }
            ]
          }
        ).render();

        var lis = Y.all('.tree-node');
        console.log(lis); // 2 items here

        setTimeout(function(){

            var lis = Y.all('.tree-node');
            console.log(lis);// 28 here
        }, 1000);

Solution

  • There is an event for this called "render"

    new Y.TreeView({
            boundingBox: '#fruits',             
            children: [...],
            on: {
                render: function(){/*Your code here*/}
            }
    }).render();