+ Start a Discussion
Craig JonesCraig Jones 

jQuery ready function not firing

Hi,

 

I have been following a jQuery + visualforce tutorial but it seems the ready function is not firing. The basic code in the example below creates two links. On clicking the first link an alert should pop up that is defined within the ready function. On clicking the second link an alert should pop up that has been defined as a seperate function.

 

The first link does not fire the alert (set up through the jQuery ready function).

The second link does fire the alert (set up in a standard function).

 

I have added the jQuery resource to my salesforce environment by following examples, but i am wondering if i have missed a step?

 

<apex:page >
<apex:includeScript value="{!URLFOR($Resource.jQuery, '/js/jquery-1.8.3.js')}"  />
<apex:includeScript value="{!URLFOR($Resource.jQuery, '/js/jquery-ui-1.9.2.custom.js')}"  />
<apex:stylesheet value="{!URLFOR($Resource.jQuery, '/css/ui-lightness/jquery-ui-1.9.2.custom.css')}"  />

     <script type="text/javascript">
        j$ = jQuery.noConflict();
 
        j$(document).ready(function(){
            j$("#ninjaLink").click(function() {
                alert("NINJA STAR TO FACE!!!!!");
            });
        });
        
        function showMessage() {
            alert("NINJA KICK TO FACE!!!!!");
            return false;
        }
        
     </script>        
 
    <a id="ninjaLink" href="">NINJA STAR ATTACK!</a>
    <br/>
    <br/>
    <a id="ninjaLink2" href="" onclick="showMessage()">NINJA KICK ATTACK!</a>
 
</apex:page>

 

Thanks for any support,

Craig

 

 

 

Best Answer chosen by Admin (Salesforce Developers) 
Craig JonesCraig Jones

Hey,

 

Thanks for the heads up with the Javascript console. It pointed out 404 error messages. When i looked into the directory structure a bit more, it seems i was missing the top level folder.

 

The link is currently:

<apex:includeScript value="{!URLFOR($Resource.jQuery, '/js/jquery-1.8.3.js')}"  />

 

But should have been:

 

<apex:includeScript value="{!URLFOR($Resource.jQuery, 'jquery-ui-1.9.2.custom/js/jquery-1.8.3.js')}"  />

All Answers

bob_buzzardbob_buzzard
Do you have any errors when loading the resources or in the javascript console?
Craig JonesCraig Jones
Ahh, i didnt think of looking at the javascript console. It turns out i am getting 404's [image: Inline images 2] I added the zip file as a static resource and the visualforce page points to the files in the correct directory structure of the zip file. [image: Inline images 1]
bob_buzzardbob_buzzard

Can't see the images I'm afraid - they are just coming through as text.

Craig JonesCraig Jones

Hey,

 

Thanks for the heads up with the Javascript console. It pointed out 404 error messages. When i looked into the directory structure a bit more, it seems i was missing the top level folder.

 

The link is currently:

<apex:includeScript value="{!URLFOR($Resource.jQuery, '/js/jquery-1.8.3.js')}"  />

 

But should have been:

 

<apex:includeScript value="{!URLFOR($Resource.jQuery, 'jquery-ui-1.9.2.custom/js/jquery-1.8.3.js')}"  />

This was selected as the best answer