6

I've googled this extensively and still can't debug the issue - I'm setting var $j = jQuery.noConflict();, I've verified that the js and css files are loading properly on the page. Can anyone see what I'm doing wrong here? I'm also using bootstrap but it's working fine and I assume that wouldn't cause a conflict. Following this example.

Includes:

<link href="{!URLFOR($Resource.jQueryUI, 'jquery-ui-1.11.4/jquery-ui.min.css')}" rel="stylesheet" />
<apex:includeScript value="{!URLFOR($Resource.jQueryUI, 'jquery-ui-1.11.4/jquery-ui.min.js')}"/>
<apex:includeScript value="{!URLFOR($Resource.jQueryUI, 'jquery-ui-1.11.4/external/jquery/jquery.js')}"/>

The script:

<script type="text/javascript">

  var $j = jQuery.noConflict();

  j$(document).ready(function(){
        j$("#ninjaLink").click(function() {
            alert("NINJA STAR TO FACE!!!!!");
        });
    });


</script>

<a id="ninjaLink" href="">NINJA ATTACK!</a>

Just to verify the files are loading, this is right from the page (both jquery.js and jquery-ui.min.js are loaded, as well as the css): enter image description here

9

Problem is that you have created a variable $j but you have used j$ in the script to access DOM elements. Just change the variable name to j$ and that should start working.

2
  • 2
    doh! this is exactly right. was tearing my hair out over this, it works now. i'll accept in 10 mins ;) – Brian Mansfield Apr 27 '15 at 14:45
  • 1
    Here is a way to stick to using $ for jQuery without impacting any other definitions of $ force201.wordpress.com/2015/04/18/…. – Keith C Apr 27 '15 at 16:31

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.