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

I am trying to run my JavaScript code in SharePoint2010 but I don't know how to do that.

I created a visual web part and added the following simple JavaScript code, but it's not executing in my SharePoint page when I add the web part to my page

<Script type="text/javascript">
$(document).ready(alert("JavaScript code"));
</script>

How can I add my javascript to the sharepoint page?

share|improve this question
    
You can add javascript to SharePoint page using SharePoint designer. Have you tried this.? –  Rahul Gokani Dec 2 '13 at 12:03
    
no. I'll give it a try. –  Anand Dec 2 '13 at 12:06
    
Ohk.. Try it first. I think it might solve your problem. –  Rahul Gokani Dec 2 '13 at 12:07
3  
I think, you might have missed the reference to jQuery script file. Either add the latest jQuery script file in the master page or script tag just above you add $(document).ready(...) stuff with src. –  suryakiran Dec 2 '13 at 13:04
    
see suryakiran comment, also use _spBodyOnLoadFunctionNames. –  Alexander Dec 2 '13 at 13:53
show 2 more comments

4 Answers 4

Open developer panel in your browser and check that there are no errors. In your case it seems that you not add jquery reference to the page). About how you can add javascript to the sharepoint page:

  • Content Editor Web Part - Use a CEWP when you want to add code to a single web page that is also a web part page. (See the Web Part chapter of my book for ways to see if a page is a web part page)
    Features: Easy to use (Source Editor in 2007 and HTML editor in 2010) Easy to reuse (Exportable - see the Web Part Must Knows chapter of my book for details) Can be placed directly in the web part page that needs the JavaScript or CSS JavaScript or CSS can also be added by linking to a text file stored in a SharePoint library. This file can have any extension, but using .HTM will let you open the file directly into SharePoint Designer.
  • Directly in a page - Use SharePoint Designer when you want to directly edit a Basic Page, Web Part page or a site page. You can add the JavaScript inside of tags, the CSS inside of tags, or link to a file that contains the code. Typically add your code just before the ending content tag for PlaceHolderMain. ()
  • Master Page - Use SharePoint Designer to add code to a master page when you want to code to be available on every page in a site. You can add the JavaScript inside of tags or link to a file that contains the JavaScript. Typically add your CSS just before the section and your JavaScript just before the tag.

See the link

share|improve this answer
add comment

if you intend to use a CEWP, then link it to a .js file which contains the following code:

<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script> 
<script language="javascript" type="text/javascript"> 
$(document).ready(function() {
alert("JavaScript code");
});
</script>

Store this .js file in a SharePoint library and then link it to the CEWP.

share|improve this answer
1  
Thank you Robert ! –  Vishal Dec 4 '13 at 9:47
add comment

This may not be the actual root of you issue, but there's a known incompatibility issue with jQuery and one of the SharePoint Javascript.

Especially, the file cmssitemanager.js redefine the $ alias (see $ in cmssitemanager.js conflicts with $ in jQuery).

To solve the issue, I suggest you to refactor your jQuery code like this:

<Script type="text/javascript">
    (function($) {
         $(document).ready(alert("JavaScript code"));
    })(jQuery);
</script>

this construction will avoid the conflict by creating a local $ variable which will be provisionned by the actual jQuery object, and not the sharepoint's one.

share|improve this answer
add comment

Few Issues:

First, You are not referencing JQuery. Add one of the references below to your script and it should work.

You can use web references like the ones below:

(you will need to close and correct the brackets as I have intentionally removed them to be visible)

script src="http://code.jquery.com/jquery-latest.js"

script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"

Second, $(document).ready would work if you add a $(document).Execute or $(document).Delay until the script is loaded.

share|improve this answer
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.