Take the 2-minute tour ×
SharePoint Stack Exchange is a question and answer site for SharePoint enthusiasts. It's 100% free, no registration required.

Currently I am using this method in the header:

<script src="/_layouts/MNCAssets/scripts/jquery-1.5.1.min.js"></script>

But for some reason, my webparts that use jQuery don't appear to be registering the OnClick event for elements correctly. Am I using the correct method to add jQuery to my SharePoint 2010 MasterPage? If so, does anyone know why my OnClick events are not firing?

share|improve this question
    
I've merged your other post into this one as they are the same question (and this one is worded better). Please try editing your original question to make it clearer rather than asking a second one next time. Thanks! –  Alex Angas Aug 22 '11 at 4:01
add comment

7 Answers 7

up vote 8 down vote accepted

You have a couple options here (...I've used both successfully in the past):

1) Call _spBodyOnLoadFunctionNames.push("function()"); replacing function with the name of the function in your webpart. This will cause your function to be executed after the body of the page if fully loaded and in sequence with other startup client-side scripts.

2) You can go the Scripts on Demand route that's new in 2010. There's a method called ExecuteOrDelayUntilScriptLoaded that causes functions to be queued up until their dependent scripts are loaded...this is usefull if you're using the client object model and you want to make sure SP.js is loaded before you do anything else, but it can be used to check for the presence of any script file. You would just add the method to your web part's script block and have it execute you start-up function after the dependent script is loaded.

ExecuteOrDelayUntilScriptLoaded(myfunction, "sp.js");

function myfunction() {
    // do something
}

Here's a good write-up from Christian Glessner on SOD if you want to learn more on the topic: http://www.ilovesharepoint.com/2010/08/sharepoint-scripts-on-demand-spsod.html

share|improve this answer
add comment

This is similar to how I add jQuery for my masterpage. The only difference is the type property and my specific location for the jQuery files.

<script src="/_layouts/jquery1_5/jquery-1.5.1.min.js" type="text/javascript"></script>

You can also use a link to a CDN provider for the files like Microsoft or Google.

For the troubleshooting, first thing I check is if the file loads. You can do this with the developer tools in IE. Press F12 while viewing your site. Highlight the tab for Script and open the dropdown box just to the left of the Start debugging button. This will display all of the script files requested by your pages. Highlight the line for your jquery script. If it loaded the window will display the contents of the file. If it is blank, the file is not loaded.

share|improve this answer
add comment

Make sure your own code runs inside:

$(document).ready(function(){
    // code here
});

Another thing that I've come across is that some custom web parts load asynchronously meaning that when your onclick-event adder gets executed, the element you are trying to add the event to isn't in DOM yet. For example Infopath 2010 forms work like this. Those elements only appear in the page&DOM maybe 150ms after the $(document).ready gets executed..

The way I got around this is that I created a small timer script that checks every 50ms whether an element has been added yet. Quite inefficient but it did the trick!

share|improve this answer
add comment

use $(document).load() or $(document).ready() OR document.readyState (non - jquery)

share|improve this answer
    
I'm already using $(document).ready() what is the difference between that and load? –  Abe Miessler Aug 19 '11 at 20:29
    
$(window).load() waits for all resources to be done loading, whereas $(document).ready() loads after the DOM is ready for manipulation but before resources such as images are loaded. –  nfw Aug 19 '11 at 21:05
add comment

Perhaps the better way is not change Masterpage and use customaction for ScriptLink to add a reference to jQuery file. my jQueryLoader project on github (https://github.com/Hameds/Araye.SharePoint.jQueryLoader) helps you easily add jQuery to your site by activating one feature. github repository has source and wsp for that.

share|improve this answer
add comment

I have written a feature that when activated at the Site Collection Settings, will inject the jQuery library into the Masterpage using a delegate control. That way you can add the library on a site by site basis.

Bismarck

share|improve this answer
add comment

You can load the jquery library within each web part. We experienced the same problem and this was the only solution that worked. The master does not load until after the web parts have loaded.

share|improve this answer
2  
This is just so bad advice! There is a great answer provided in this thread that makes it work very well referenced in master page etc. –  Robert Lindgren Apr 3 at 17:08
add comment

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

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