Bind an Event via a JSON Model

Question

I wonder if it is possible to bind an Event via a JSONModel.

If I do so, it will always throw this Exception:

Uncaught TypeError: I.fFunction.call is not a function

This is my code:

_ViewReference: undefined,
_oMenuItemsConfigModel: undefined,
createMenu: function(oItem){
    if (!this._menu) {
        this._menu = new sap.ui.unified.Menu(this._oMenuConfig);
        this._menu.setModel(this._oMenuItemsConfigModel);

        this._menu.bindAggregation("items", "/", new sap.ui.unified.MenuItem({
            text: "{text}",
            icon: "{icon}",
            select: "{select}",
            enabled: "{enabled}"
        }));

        this._ViewReference.addDependent(this._menu);
    }

    var eDock = sap.ui.core.Popup.Dock;
    this._menu.open(false, oItem, eDock.BeginTop, eDock.BeginBottom, oItem);
    return oItem;
}

I have a Universal ContextMenu which just needs some config in order to get created. This is how I call this function from my Controller:

var oContextMenu = new ContextMenu(this.getView(), 
    new sap.ui.model.json.JSONModel(
        [
            {
                text: "Copy",
                select: [this.onContextMenuItemCopySelected, this]
            },
            {
                text: "Paste",
                select: [this.onContextMenuItemPasteSelected, this]
            }
        ]
    )
);

Here is a JSBin Example.

schnoedel · Accepted Answer · 2016-01-22 09:35:24Z

1

You cannot use databinding for events. But you can implement an universal event handler for your menuitems that will call the appropriate function.

Bind the menu items select event to a common event handler:

this._menu.bindAggregation("items", "/", new sap.ui.unified.MenuItem({
                text: "{text}",
                select: [this.onSelect, this]
            }));

And implement the handler like this:

onSelect:function(oEvent){
          var item = oEvent.getParameter("item");
          var context = item.getBindingContext();
          var fnConfig = context.getProperty("select");
          fnConfig[0].bind(fnConfig[1])();

       }

fnConfig is the Array of function an this-object from the model. Using Function.bind() lets you call the function on the given this object.

Here it is on JSBin

answered Jan 22, 2016 at 9:35

schnoedel

3,9381 gold badge16 silver badges17 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

schnoedel Over a year ago

It works in the JSBin, doesn't it? And please mind that i have added the onContextMenuItemCopySelected and onContextMenuItemPasteSelected functions to the controller in the JSBin example. Do you have some differences to your JSBin example in your real code?

B. Kemmer Over a year ago

nope of course it works! But i seriously dont get it why it doesn't work with a binding! Nevertheless, this is a great work around.

schnoedel Over a year ago

SAP has implemented databinding only for properties associations and aggregations. Its all in the ManagedObject. I guess they are assuming that the model contents are always data only. Loaded from a webservice that is true - but your example is a good counterexample.

Collectives™ on Stack Overflow

Bind an Event via a JSON Model

1 Answer 1

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related