onclick function in ui.frontend

Question

Hi everyone

I’ve created a custom component button search

Here’s the HTML of the button (buttonsearch.html)

On the ui.frontend > src > main > webpack > components ( there’s scss and js files) I’ve created a js file ( _buttonsearch.js), where my function “displayModal” is defined

But when i click the button I get an error “Uncaught ReferenceError: displayModal is not defined” anyone knows hpw could I make it work ?

Thanks in advance.

arunpatidar · Accepted Answer

Hi,I would suggest to add a class/id to button and get the button instance inside your javascript.But answering your question, the scope of the function is not global thats why it is not undefined outside its scope. you can create as a global function to make it work, e.g. jquery plugin https://learn.jquery.com/plugins/https://codepen.io/arunpatidar02/pen/yLoqrYv

BrianKasingli · Answer

Assuming that you are using the latest aem-project-archtype, ensure that you have all your imports are identified from the main.ts or main.js file.

The out of the box main.ts file looks like this; aem-project-archetype/main.ts at develop · adobe/aem-project-archetype · GitHub

Sign up

Login with SSO

Login to the community

Login with SSO

Scanning file for viruses.

This file cannot be downloaded