How to access certain event parameters in UI5 event handlers?

I’m trying to build an application using SAPUI5. Right now, I have a page with nodes listed as a tree, and a navigation frame at the center. I want to load various pages in the navigation frame based on the node selected in the tree.

I tried to handle the JS event the following way, but it doesn’t seem to be working.

function Tree_Click(oControlEvent){
    alert(oControlEvent.getParameters.node);
}

// Create the Tree control for the MENU block
var MenuTree = new sap.ui.commons.Tree("MenuTree", {select : Tree_Click});
MenuTree.setTitle("Home");
MenuTree.setWidth("100%");
MenuTree.setHeight("auto");
MenuTree.setShowHeaderIcons(true);
MenuTree.setShowHorizontalScrollbar(false);
//create Tree Nodes
var Node1 = new sap.ui.commons.TreeNode("Node_fruit", {
    text: "Fruit",
    expanded: true
});
var Node2 = new sap.ui.commons.TreeNode("Node_veg", {
    text: "Vegetables",
    expanded: true
});
var Node1_1 = new sap.ui.commons.TreeNode("Node_app", {
    text: "Apple",
}); 
var Node2_1 = new sap.ui.commons.TreeNode("Node_carr", {
    text: "Carrot",
});

Node2.addNode(Node2_1);
Node1.addNode(Node1_1);

// Add Tree Node root to the Tree
MenuTree.addNode(Node1);
MenuTree.addNode(Node2);

MenuTree.placeAt("menu_tree");

The alert seems to be returning undefined.
What am I doing wrong here?

3 thoughts on “How to access certain event parameters in UI5 event handlers?”

  1. FYI: You can extract more info from the passed event object:

    var oNode = oEvent.getParameters().node;
    var nodeId = oNode.sId; //eg "Node_fruit"
    var msg = oNode.getProperty("text");   //eg "fruit"
    alert("Node id: <" + nodeId + "> \n"+"Node property (text): <"+msg+">");
    
    Reply
  2. Or oControlEvent.getParameters().node.

    oControlEvent.getParameters without parentheses is a function pointer, not the return value of the function call…

    Reply

Leave a Comment