Hi all,
When you add an event listener using JavaScript, you define a function that will be called, and one of the defult input parameters accessable when that function is defined is the 'event'. This can be useful to know where the user clicked, what button the pressed, prevent default behaviour, stop propogation etc.
Is there a way to access this same event property somehow in a Client Action? Or do we have to use JavaScript if we need to access the event?
For example, can I use the event somehow to stop propogation when a user clicks on a button that is within a div which also has an OnClick on it?
Hi @Nicholas Campbell ,
if you define an input parameter of type object on your client action, you can pass the event into it.
You would however need a Javascript node inside your client action to actually do something with it, not sure if that is what you are looking for.
document.getElementById($parameters.InContainerId).addEventListener("click", function(event) { $actions.RunOnClickWithEvent(event); });
Dorine
Thanks Dorine, this is definately an option.
I would prefer to not have to create an EventListener using JS though. I would rather use the normal event handler of the widget (OnClick, OnChange etc), but then be able to access the event in that action.
I would definately use JS in the client action to use the event, but I'd rather that be the only JS required, rather than using JS to both set the eventListener and then also handle the event in the client action.
Any possibility of that?
I would think this would be quite useful since there is a lot you can do when you have access to the event, and I would think that it would not be too hard for OutSystems to expose that for use since behind the scenes the event handlers of the widgets are just EventListeners right and so they should have the event in their scope?
Thanks
aaah, ok. I misread the question, it sounded to me like you had some custom javascript, and wanted to pass event information into a regular Outsystems client action.
So, I'm not sure why you would be interested in the low level event implementation, what is it that you need to know of the event that you can't just pass as an input in a low code fashion ??? What do you mean with "a lot you can do" ?
Hi Dorine
As examples
How would you stop event propogation besides using the event object?
event.stopPropagation()
Or know what key the user pressed in an input?
event.key
Or know what element a user clicked on? (without a lot of separate actions...)
event.target
See also: https://www.outsystems.com/forums/discussion/71896/how-html-button-with-java-script-click-event-with-parameter-in-outsystems/
Thanks Daniel, seems there is no built in method to be able to do this then? I would think it wouldn't be too difficult based on my knowledge of JS, to add this as a standard feature since the event would be there in the client action already, just not made available to use right now?
Indeed
Hi @Nicholas Campbell
The event property is automatically available in a JS node in your client action, you don't need to pass anything using inputs, just create the JS node in the action that you defined as handler and type event in it.
- Daniel
@Nicholas Campbell curious what you ended up doing here. I have the same problem. I know I can set up an event listener manually and then do the code I want. But I'd rather not do that and then have to remove the listener when it's already built in for us. I know I can access 'event' in my JS node, but it's deprecated so I don't want that function to suddenly go away. What did you end up doing?