4

I've been doing lots of reading about all the nifty things that can be done using jQuery on a SharePoint site. I decided it was time to dive in! Unfortunately, I seem to have hit my first stumbling block right out of the gate. Following a couple blog posts, I'm trying to add the reference to the master page. I added:

<script language="javascript" src="jquery-1.3.1.min.js" type="text/javascript"></script>

to the <head> section of the master page. The .js file is in the root directory of the site. I'm trying to run a test to see if it's being included with the following code:

<asp:Content id="Content1" runat="server" contentplaceholderid="PlaceHolderMain">
    <script type="text/javascript"> 
        $(document).ready(function() { 
            $("#cb").live('click', function() { 
            $("#lblMessage").text("you clicked on CheckBox, selected = " + $("#cb").attr('checked')); 
            }); 
        }); 
    </script> 
    <input type="checkbox" id="cb" /> 
    <label id="lblMessage"></label>
</asp:Content>

When I load the page I get an Object Expected Error at the point where the first $ is.

What am I missing here?

5 Answers 5

3

In your masterpage, you need a reference to you jquery javascript file.

Add this line in the head of your MasterPage, and you should stop having this error.

<script language="javascript" type="text/javascript" src="%PATHTOYOURJQUERYFILE%/jquery-1.4.2.min.js"></script>

Good luck!

2
  • 1
    Thanks! I found a reference here (blogs.msdn.com/b/publicsector/archive/2010/06/28/…) to a method of referencing a Microsoft's CDN that seems to have done the trick. I think my problem was I wasn't putting the url to my jquery javascript file in there properly. All working great now. On to many new things to be confused by :)
    – user1250
    Oct 22, 2010 at 19:18
  • Usign a CDN is all well and good if perhaps your on a public facing web. If your corporate internal then how many times has your internet gone down ? Also Consider that if you ever need to go SSL then having scripts from a different origin will give you those nasty warnings from your browser.
    – BinaryJam
    Feb 29, 2012 at 10:13
2

You can use below tag for your jQuery.js file in master page (default: v4.master)

<SharePoint:ScriptLink language="javascript" name="/_layouts/Scripts/jquery-1.4.1.js" runat="server"/>
2

The way you are doing it is curently right you just need to include your function on the page load that will mean instead of using the ordinary onload function you use the following snippet.

Also note you have to always include all your JS in the PlaceHolderAditionalHead if you are on an aspx page. You can also reference your jQuery in that placeholder in cases where you just need jQuery on that specific page. It will work if you include it on the placeholder main but thats not the best practice.

This is the code you will need to use always when you want a function to run on page load. Thats where you missed it.

 <script type="text/javascript">
_spBodyOnLoadFunctionNames.push('yourReadyFunction');

        function yourReadyFunction() {  
            $("#cb").live('click', function() {  
            $("#lblMessage").text("you clicked on CheckBox, selected = " + $("#cb").attr('checked'));  
            });  

</script>  
1

What you are missing is that jQuery is not native to SharePoint.

Browse the SharePoint blogosphere, and you'll find lots of helpful posts showing different ways to link to your jQuery.js file. I won't list them here are there are many, and the right way depends on what you plan to do.

Instead, let me highlight a couple points that these blogs won't tell you:

  • like any abstraction layer, using jQuery has a performance impact; it is often better to use plain JavaScript (the language jQuery is built on).
  • jQuery has a life of its own, and requires maintenance like any code. New versions are released every three to six months, and may require you to update your own scripts.

So have fun playing with sample scripts, but think it twice before using it in a production environment!

3
  • To make my point, see how the other answers reference different versions of jQuery. For the record, the current version of jQuery is 1.4.3.
    – Christophe
    Oct 22, 2010 at 14:54
  • Good advice. I'll definitely keep that in mind.
    – user1250
    Oct 22, 2010 at 19:18
  • Update: t seems that the jQuery reference was not showing up initially in your question. So please ignore the first sentence in my answer. The comment about versions remains valid!
    – Christophe
    Oct 25, 2010 at 1:33
1

I started with a large article but these entries give you something to consider about the various approaches. As the question is already answered.

Primary Focus - using a doc lib http://geekswithblogs.net/SoYouKnow/archive/2011/07/28/a-dummies-guide-to-sharepoint-and-jqueryndashgetting-started.aspx

Using Delegate Controls http://blogs.msdn.com/b/kaevans/archive/2011/04/06/adding-jquery-to-every-page-in-sharepoint-with-delegate-controls.aspx

From Chris O'Brien's blog - Just go read everything of Chris' on jquery and OM dev

If using jQuery with SharePoint 2010, ALWAYS put jQuery into ‘no conflict mode’ via jQuery.noConflict(). This is necessary because SharePoint’s internal JavaScript uses the $ symbol as a variable name in a couple of places, and this causes clashes since it’s the alias used by jQuery

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.