Add event listeners to events programaticlaly

Is there a way to assign an event call back to an event (say Button.onClick) programmatically?

Something like button1.addEventListener(“onClick”, button_1_click)
or button1.onClick += button_1_click;

Not directly like that, but did you know that you can store functions in the appsmith store? It looks like this:

// MyJsObject
export default {
  myFunc1: () => { 
    showAlert('Ran myFunc1')
    return true

// Elsewhere in your JS
await storeValue('myWellNamedCallback', MyJsObject['myFunc1'])

// In your buttons onClick event
{{ || myFallbackFunc() }}

You want any callback you define in your object to return true so that we can use the OR operator (||) to define a fallback in case we haven’t stored a function yet.

That looks nice. But how do I do something like this:

for (button in buttons)
button.onClick += button_click;

Can you tell us more about your use case here?

I create dynamic tables (with dynamic columns) and want to make them editable and assign a corresponding call back in code.

That sounds very interesting. Could you elaborate further?