jquery in a visualforce page

I am new to using jquery in visualforce and seem to be stuck just getting the static resource to work correctly. I have two js files, one is the jquery the other is a qrcode generator. Both are loaded as static resources and find my pages in the “where it is used” function. I have followed the doc as best I can but still cannot get the JS to work.

Code chunk inside my VF page is as follows:

<html>
<body>
<p>
   <b> QR Code </b>
</p>

<div id="output"></div>
<apex:includeScript value="{!$Resource.jquery}"/>
<apex:includeScript value="{!$Resource.jsqr}"/>
<script>
jquery.noConflict();
jquery(function(){
    jquery('#output').qrcode("testqrcode.com");
})
</script>

</body>
</html>

Answer

javascript is case sensitive with shortcuts like jquery so use jQuery instead as your shortcut…

more like:

<script type="text/javascript">
    $.noConflict();
    (function($) {
        // Code that uses jQuery's $ can follow here.
    }(jQuery);
</script>

Attribution
Source : Link , Question Author : Gordon Derk , Answer Author : Matt and Neil

Leave a Comment