5

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

1 Answer 1

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 ;) Commented Apr 27, 2015 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
    Commented Apr 27, 2015 at 16:31

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .