Problem solve Get help with specific problems with your technologies, process and projects.

Using jQuery to extend SharePoint

Need more than SharePoint's out-of-the-box Web parts have to offer? Here are ways you can extend the SharePoint UI with only a browser and jQuery.

While SharePoint offers a number of ways to change content structure for subsites, lists, libraries, views, columns, content types and the out-of-the-box Web parts, sometimes it's just not enough.

More SharePoint Resources

This section covers SharePoint implementation concerns, such as upgrading and implementing MOSS 2007, support, workflow management, enterprise search, SharePoint customization, and the dos and don'ts of SharePoint deployments.

Management and Administration
From creating a multidimensional monitoring strategy to setting guidelines for site provisioning, this topic page has the tips, tools and resources you need to effectively manage and administer SharePoint.

This topic page has the Microsoft SharePoint governance resources admins need to control a Microsoft SharePoint environment and shape their deployment to meet their business needs.

There are times when users or designers and developers need to make changes to the functionality and appearance of a SharePoint site in a way that is not allowed by their IT department. Since SharePoint Designer is restricted in most organizations, it is not usually an option. Another more accessible possibility is jQuery.

JQuery is a JavaScript library that lets you manipulate the user interface of SharePoint in a way that does not impact a site beyond the page. It can do this because the code is only executed in the browser and on the Web page. It has no impact on what the server serves up, which gives users a great deal of freedom beyond the out-of-the-box functionality and UI.

Adding some jQuery code to your site is simple because SharePoint already provides the means to do it -- the humble Content Editor Web Part (CEWP). While this Web part is usually used to display formatted text on a SharePoint page, it can also be used to run jQuery scripts. All you have to do is add a CEWP to your page, paste in the script, press OK or apply it. No need to compile code on the server, no complex change control procedure to get through with IT, and if it goes wrong, the worst situation is that you will have to remove the Web part from the page. The only thing you should test are browser versions, just to be sure they are compatible.

JQuery uses a library of functions hosted by Google to manipulate the data or structure (such as cascading style sheets) on your page. For that reason, most examples of jQuery you will find on the Web contain a line like this at the top:

<script src="" type="text/javascript"> </script>

This lets the script see the functions it needs to do its job. It is possible to copy the jQuery libraries to your own server, but why not let Google host, manage and maintain them for you for free? Use jQuery for three main categories of action on your SharePoint site: change functionality, change appearance and access data.

Here are some examples of all three from the Web:

Changing functionality
In this example, it allows you to scroll through a list while keeping the column headings static. The normal functionality in SharePoint is when you load a large list and scroll down, the column headers are hidden. This script places a scrollbar in the list so the column heading stays put.

Changing appearance
This example shows how you can use jQuery to change the appearance of the Quick Launch menu. It does this by making changes to the CSS classes that SharePoint uses for the quick launch and adds extra code to them.

Accessing data
This final example is the most complex. It accesses the MOSS 2007 Search Web Service to find individual results and display them in the page. It also adds some clever code that begins the search as soon as the user starts typing the query.

With the advent of SharePoint Online, access to the back end of your SharePoint system will become even more limited. Power users and developers will have to devise more sophisticated ways to manipulate the data and interface for SharePoint. JQuery has some amazing potential as well as a large and healthy online community behind it to help it grow.

Stephen Cummins, founder of, is a SharePoint consultant and has been a SharePoint MVP (Most Valuable Professional) for the past seven years. He lives in Kildare, Ireland, with his wife, daughter, two dogs and an ever-changing number of goldfish.

Dig Deeper on SharePoint administration and troubleshooting

Join the conversation

1 comment

Send me notifications when other members comment.

Please create a username to comment.

Mariusz Postol Do you know any project on integration of OPC Unified Architecture and SharePoint using the server object model. We started work on it but maybe someone has out of the box solution. The idea of integration a collaboration platform and application to application centric communication seems to be a milestone for Smart Factory concept (