How to add jQuery to SharePoint

jQuery is an almost must-know technology today for SharePoint developers. Many web and SharePoint projects utilize it. When you work with jQuery in SharePoint you have to three things to do. The first one is loading jQuery into SharePoint, then you can add it to the page, and finally you can use it as you need. Today I would like to show you how we can add jQuery library into our SharePoint, for both clouds and on-premise installation. Every solution has own advantages and disadvantages, and some of them can’t be used in the cloud, according to the limitation from Microsoft.

1. How do add jQuery to SharePoint as Sandbox solution. Of course, official papers from Microsoft states that in the next releases of SharePoint sandbox will be retired, but right now It can be used, and what’s more it works great in SharePoint online. Also in this case we don’t need support from the Farm administrator for our project implementation. So how to do this?

Let’s create a new empty SharePoint project in Visual Studio, and then add to our project Module.

Then we should change name of our folder from Module to Assets, delete file Sample.txt  and just make drag and drop of our library. Did you see that our file Elements.xml has been updated with new reference.

Then it’s necessary to add attribute URL z opcją “SiteAssets” into our configuration file. Finally we should see something like this:

<?xml version="1.0" encoding="utf-8"?>
<Elements xmlns="http://schemas.microsoft.com/sharepoint/">
  <Module Name="Assets" Url="SiteAssets">

    <File Path="Assets\jquery-2.1.3.js" Url="Assets/jquery-2.1.3.js" />
  </Module>
</Elements>

After deploying to our site collection we will have access to our library. In my case address to the library is the following:

http://intranet.wingtip.com/sites/DevApp/SiteAssets/Assets/jquery-2.1.3.js

2. Add it to Layout folder. This solution is implemented on the SharePoint farm level, which require full administration permission, which means that it can’t be used in the cloud Office 365. In this case when we create new solution in Visual Studio we should select “Deploy as a farm Solution”, and then we have to map SharePoint folder “Layouts” into our solution. After that we need just make drag and drop of our library into subfoler.

Then we need just make a deploy and our library is accessible at http://intranet.wingtip.com/_layouts/15/jQueryLayouts/jquery-2.1.3.js

UPDATE. Yes, I know that there other options for adding jQuery to SharePointa :). Maybe next time :).