Your achievements

Level 1

0% to

Level 2

Tip /
Sign in

Sign in to Community

to gain points, level up, and earn exciting badges like the new
Bedrock Mission!

Learn more

View all

Sign in to view all badges

SOLVED

Trigger onclick event to a coral button component in aem 6.5

Avatar

Level 2

Hi 
I am trying to use a coral button component to get a text field. I am not able to understand how to trigger onClick event for this button. 
I have used "granite/ui/components/foundation/button" as sling:resourceType to a nt:unstructured node and created the button.
Can anyone suggest how to get a text field by clicking on the button.

1 Accepted Solution

Avatar

Correct answer by
Community Advisor

Hi @sushmapoojitha 

 

You can use Coral resource type i.e. granite/ui/components/coral/foundation/button and define a granite:class property with some defined class name for the button let's say class name is "button-class-hero". Then you can add a component specific extraClientLibs which will be loaded only during dialog authoring and the below piece of code should work.

 

(function ($, $document) {
$(document).on("click", ".button-class-hero", function () {
alert("Hi"); // Rest of the code will go here
});
})($, $(document));

asutosh_jena_0-1619936904857.png

 

Hope this helps!

Thanks

View solution in original post

0 Replies

Avatar

Correct answer by
Community Advisor

Hi @sushmapoojitha 

 

You can use Coral resource type i.e. granite/ui/components/coral/foundation/button and define a granite:class property with some defined class name for the button let's say class name is "button-class-hero". Then you can add a component specific extraClientLibs which will be loaded only during dialog authoring and the below piece of code should work.

 

(function ($, $document) {
$(document).on("click", ".button-class-hero", function () {
alert("Hi"); // Rest of the code will go here
});
})($, $(document));

asutosh_jena_0-1619936904857.png

 

Hope this helps!

Thanks