Dynamically setting the press event for a sap.m.Button inside a sap.m.Table

Hi, I’d like to know what is the simplest correct way (if one exists) to dynamically bind the press event on a sap.m.Button contained into a sap.m.Table?

I was (somehow) expecting this code to work:

 new sap.m.Button({
        text:"{w/buttonText}",
        type:"{w/buttonType}",
        enabled:"{w/buttonEnabled}",
        press:"{w/buttonCallback}"
       }),

with the w/ being a JSON object of this type:

interface WorkflowInInvoiceTable {
  buttonText: string
  buttonType: sap.m.ButtonType
  buttonEnabled: boolean
  buttonCallback: (e) => void
}

But it seems this is not the case:

Uncaught TypeError: I.fFunction.call is not a function
    at f.a.fireEvent (sap-ui-core.js:449)
    at f.a.fireEvent (sap-ui-core.js:989)
    at f.firePress (sap-ui-core.js:573)
    at f.B.ontap (library-preload.js:696)
    at f.a._handleEvent (sap-ui-core.js:974)
    at constructor.U._handleEvent (sap-ui-core.js:1203)
    at HTMLBodyElement.p (sap-ui-core.js:115)
    at HTMLBodyElement.dispatch (sap-ui-core.js:126)
    at g (sap-ui-core.js:1783)
    at HTMLBodyElement.p (sap-ui-core.js:1783)

Everything binds perfectly but the {w/buttonCallback} that, if put into a normal text field, is correctly stringified.

Note: I’ve already worked out the gazillionth workaround, so I don’t need a consultant action, but having data and manipulators serializable into the same JSON object could be more elegant.

–R

[codeworrior]

Data binding is only supported for properties and aggregations, not for events, not for associations. In declarative views (XMLViews - sorry to mention them in your post @RobertoMalatesta 😃 ), you can refer to controller methods by their name. In JS code, you can to refer to them by reference:

w = /* some instance of WorkflowInInvoiceTable */  ...;
new sap.m.Button({
        text:"{w/buttonText}",
        type:"{w/buttonType}",
        enabled:"{w/buttonEnabled}",
        press: [w.buttonCallback, w]
}),

The array notation with function + context (thisArg) is UI5 specific and ensures that the handler is called with the right this. For sure you can use w.buttonCallback.bind(w) instead.

HTH + Kind Regards

[RobertoMalatesta]

@eomere I suspect it won’t work inside a sap.m.Table (the problem I had), since sap.m.ColumnListItem templates the column once per column. (So the press function is the same for all elements in the column, not dynamically set with different functions called on different items). I could be wrong since it was one year ago. @codeworrior can correct me.

–R