379
Views
13
Comments
Solved
Triggering a button through JavaScript (cannot read property 'click' of undefined )
Application Type
Traditional Web

Hello so I'm using a forge application called WidgetLibrary40, and I'm trying to trigger a button so I can run a server action, but it appears an error on the console. At the moment I'm calling this function that triggers the click 

function executeNavigationAction()  {

  document.getElementById('"+ok.Id+"').click();

}

The function works but the click doesn't, thank you for your help.


Screenshot42.png
UserImage.jpg
Daniel Breia
Solution

Hello everybody,

Just want to say thank you for your help, what I did to solve the problem was instead of trying to click the button to run the screen action, I created a parameter in JavaScript that allows me to pass the data I needed. Thank you anyway for your help.

Regards,

Daniel

2023-04-07 07-55-02
Krushna Mantri

Hi Daniel,

From the error, it seems to be JS not able to get the element by Id so please check the document.getElementById should have appropriate Id

If possible could you please share oml, so we can track the error

Regards,

Krushna

UserImage.jpg
Daniel Breia

Hello Krushana,

I'm sorry but I can't share the oml, but I will try and see if I can find it, if I do I will alert you later.

Thank you anyway.

2020-11-20 07-43-04
Unnati Khanorkar

Hi Daniel,

Do you only want to trigger the button through JavaScript? If you are doing it in a screen action then you can use Widget_Click server action present in rich Widget component.  You can add through the manage dependencies.

You need to provide the id to trigger and it should work for you.

Let me know if this helps. 

Thanks,

Unnati K

UserImage.jpg
Daniel Breia

Hello Unnati,

Unfortenly no, because the button is in javascript and it's not a normal widget. Let me know if I'm wrong I'm a beginner in outsystems.

Thank you for your help.


2020-11-20 07-43-04
Unnati Khanorkar


Hi Daniel,

Could you please send me the screenshot of how you are defining the button and where are you executing the JavaScript(in the Run JavaScript action or on Page JavaScript).

This will help me understand your issue. 

As you have written in the expression as "ok.id" then this should be the button widget and the Widget_click action should work. Below is the configuration for the button I have used on the web Screen.

The Widget_Click action can be used for any widget to trigger the click action.

Please let me know if you need more details and can provide me the screenshots I have asked for.

Thanks,

Unnati K

UserImage.jpg
Daniel Breia

Hi so here are the screenshots of what you asked I hope it will help you, If you need anything else that I can provide please let me know, thank you! 

PS: I had to zip the screenshots sorry.

Lightshot.7z
2020-11-20 07-43-04
Unnati Khanorkar


Hi Daniel,

Please check on below  points - 

1. Please check if the button is inside any container which has the visible property set to false. The button had the CSS applied display:none that should be ok but the enclosing container should be visible.

2. If the JavaScript is being executed in the web block and the button is on parent screen then it may not be available for the web block. Try executing the script on the same screen or block where the button is present.

Let me know if you want to discuss this on life call. We can check on runtime.

Thanks,

Unnati K

2021-03-18 21-03-15
Benjith Sam
 
MVP

Hi Daniel,

Could you please share bit more information for the mentioned case like:

1) Where does the executeNavigationAction function definition is defined (expression or JavaScript section)?

2) From where/How exactly you are invoking the executeNavigationAction function?

3) Is it that you have defined a button widget named ok and its runtime Id property is ok.Id?

If you can share code/implementation screen shots with us instead of complete .oml file, it will help us to understand the case much better. 


Kind regards,

Benjith Sam

UserImage.jpg
Daniel Breia

Hello Benjith,

1)  Is defined in Javascript, in the Javascript element of the block

2) In the following screenshots

3) Yes, the button is called "ok" and i belive the runtime Id is "ok.Id"

Thank you for your help!

Lightshot.7z
2021-03-18 21-03-15
Benjith Sam
 
MVP

Hi Daniel,

Thank you for sharing the additional requested information. In context to point 1, I'm assuming that the executeNavigationAction function definition is defined in the WebBlock's JavaScript section as indicated below

Note: If you are trying to excess the button widget (or any widget) runtime Id property i.e. ok.Id from the block/Screen JavaScript section, it won't work. 

Instead define the executeNavigationAction function definition within an expression widget (Escape Content - No) somewhere at the bottom of the web block widget tree elements and then call the respective function. Also make sure that the function is invoked after the block/button/function definition  is loaded/rendered successfully.

I'm just trying to guess the solution as the case is not completely understood (if it doesn't helps, then I would request you to share a sample .oml reproducing the same implementation)


Kind regards,

Benjith Sam

2021-02-11 16-27-42
Swapnil

Hi Daniel,

Please check if the quotes you are using in the expression are correct? Try executing the same command in the browser console and check if this works(You can use inspect element to check the proper ID). Then  you should be able to get the exact issue if the id you are providing is correct or not.

Thanks,

Swapnil

2025-04-22 05-54-18
Shashi Kant Shukla

Hi Daniel,

Solution: 1

After rendering the page Id of ok button will be changed so you can not call like document.getElementById('"+ok.Id+"').click();  if you want to call through javascript then you can assign some class  to control  like below 

and you can use this class in javascript to identify that control.

Solution 2: You use Widget_Click function to trigger the button click.

Regards

Shashikant Shukla


UserImage.jpg
Daniel Breia
Solution

Hello everybody,

Just want to say thank you for your help, what I did to solve the problem was instead of trying to click the button to run the screen action, I created a parameter in JavaScript that allows me to pass the data I needed. Thank you anyway for your help.

Regards,

Daniel

Community GuidelinesBe kind and respectful, give credit to the original source of content, and search for duplicates before posting.