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

Using Jquery functions on a ClientLibrary

haroldm43863165
Level 2
Level 2

I am having some trouble on using a Jquery function my js file inside my clientLib folder. Inside my js file the code that I used was:

$(document).ready(function(){ alert("test") $('.storeLocatorFormSubmit').click(function(){ alert("Hello world"); }); });

and then stumbled on a question on Stackoverflow where it suggest that instead of using the "$" I replaced it the word "jQuery" so after changing the code into this:

jQuery(document).ready(function(){ alert("test") jQuery('.storeLocatorFormSubmit').click(function(){ alert("Hello world"); }); });

The alert with value of "test" is now being displayed on the page but the alert box does not show every time I click the button of "storeLocatorFormSubmit".

1 Accepted Solution
haroldm43863165
Correct answer by
Level 2
Level 2

Thank you for your responses.

For the

jQuery('.storeLocatorFormSubmit')

I am trying to bind a click function to a button once the form is being submitted. I gave another shot to use the keyword "jQuery" rather than "$" and it now works as expected.

View solution in original post

7 Replies
smacdonald2008
Level 10
Level 10

We have a JQUERY article with AEM https://helpx.adobe.com/experience-manager/using/integrating-jquery-framework-cq.html.

The $ is valid syntax. Try using Chrome and place a break point on the JS method. Your code looks fine. 

edubey
Level 10
Level 10

As Scott mentioned using $ is valid syntax and u can use it.

Check the error in browser console when you are using '$'

Make sure you use jquery code only once jquery library has been loaded.

Are you trying to get click in event on particular class?

haroldm43863165
Level 2
Level 2

Thank you for the quick response, yes I tried the tutorial based on the given article. But for clarification the jquery code is located on an external file. The way I setup my Client Library Folder is that I declared a dependency on the jquery library that is already present on AEM.

haroldm43863165
Level 2
Level 2

I think that the $ is valid if the Jquery code is located inside the script tag (<script>) but AEM does not recognized it if the code is on its external javascript file. Please correct me on this one.

edubey
Level 10
Level 10

U can use $ irrespective of way you load jquery

Jitendra_S_Toma
Level 9
Level 9

Hi,

Go to browser console where you have loaded your page with this code. Type below code in the browser console. 

jQuery('.storeLocatorFormSubmit')

Does it return "undefined" or an object?. if it is undefined, it means, Event binding is not happening.

haroldm43863165
Correct answer by
Level 2
Level 2

Thank you for your responses.

For the

jQuery('.storeLocatorFormSubmit')

I am trying to bind a click function to a button once the form is being submitted. I gave another shot to use the keyword "jQuery" rather than "$" and it now works as expected.