Skip to Content

Add new rows in SAP UI5 TreeTable

Hi,

I am trying to implement a TreeTable in my SAPUI5 application following the article Simple Binding of TreeTable to JSON Data. I am able to successfully display the data in the application.

However, Now I need to add and remove records at a particular row. I tried searching in SDN without any success.

Attached are my View and Component.js files (view.txt) (component.txt)

Can someone help me in achieving this functionality?

Regards,

Poojith

view.txt (1.4 kB)
component.txt (2.0 kB)
Add a comment
10|10000 characters needed characters exceeded

Related questions

1 Answer

  • Best Answer
    Posted on Jan 25, 2019 at 01:10 PM

    Hi,

    This is not completly free of bugs, but at least it works with insertion of new rows on both levels.

    You will have to go over it again, but it works basically.

    onAdd: function (oEvent) {
    
    var oTable = this.getView().byId("TreeTable");
    var oSelectedItem = oTable.getContextByIndex(oTable.getSelectedIndex()).getObject();
    this._updateDataModel(oSelectedItem, oTable.getSelectedIndex());
    },
    _updateDataModel: function (oSelectedItem, Index) {
    
    var oRoot = this.getView().getModel("NavNodesModel").getProperty("/nodeRoot");
    var oNewData = {};
    if (oSelectedItem.ParentNode) {
    	oNewData = {
    		"Name": "New",
    		"Desc": "New",
    		"ParentNode": oSelectedItem.ParentNode
    		};
    oRoot.children[oSelectedItem.ParentNode].children.push(oNewData);
    } else 
        {
         oNewData = {
            "Name": "New",
    	"Desc": "New",
    	"ParentNode": ""
    	};
    oRoot.children.splice(Index, 0, oNewData);
    }
    this.getView().getModel("NavNodesModel").setProperty("/nodeRoot", oRoot);
    },
    
    

    Best regards

    Johannes

    Add a comment
    10|10000 characters needed characters exceeded

    • Hi Johannes,

      I tried making few modifications in the view wherein each row of the treetable has a dropdown which allows the user to decide if the entry would be a element or a node. If the entry is selected as a row, then it would allow sub-elements to be added.

      In controller, I have managed to also check if the dropdown value is set to "node" and performed the required code to add it as an entry. However, I get an error "unable to push record to the element "children" : undefined". I had also attached my code in my earlier reply.

      Please could you let me know if the code needs any further changes?

      Thanks again for the information.

      Regards,

      Poojith

Before answering

You should only submit an answer when you are proposing a solution to the poster's problem. If you want the poster to clarify the question or provide more information, please leave a comment instead, requesting additional details. When answering, please include specifics, such as step-by-step instructions, context for the solution, and links to useful resources. Also, please make sure that you answer complies with our Rules of Engagement.
You must be Logged in to submit an answer.

Up to 10 attachments (including images) can be used with a maximum of 1.0 MB each and 10.5 MB total.