How to Use JavaScript in SharePoint

by Janice Uwujaren
JavaScript is a flexible scripting language that allows Web designers to add programmatic elements to a website without having to learn a complicated language.

JavaScript is a flexible scripting language that allows Web designers to add programmatic elements to a website without having to learn a complicated language.

JavaScript extends the out of the box (OOTB) capabilities of SharePoint and allows for flexible customization and configuration of SharePoint sites, without making changes to master pages or the definition of a SharePoint site. An efficient way to add JavaScript to a SharePoint page is using the Content Editor Web Part (CEWP). The CEWP is a powerful multipurpose Windows SharePoint Services (WSS) Web part that uses a rich text editor for formatted text and hyperlinks and a source editor to store HTML, scripts and custom styles. You use the source editor of a CEWP to add JavaScript code.

1

From the "Site Actions" menu of your SharePoint site, select "Edit Page."

2

Click "Add a Web Part" in the zone where the CEWP should appear.

3

On the "Add Web Parts -- Webpage" dialog, scroll down the list of Web parts and check the box to the left of the "Content Editor Web Part." This action will insert the CEWP to your site.

4

Click the "Open the tool pane" link.

5

From the "Content Editor" pane, select the "Source Editor" option to add JavaScript to the CEWP.

6

In the "Text Entry -- Webpage" dialog, insert your JavaScript code and then click "Save."

7

Expand the "Appearance" category in the "Content Editor" pane.

8

Change the title field to rename the CEWP and click "OK."

9

In the right corner of your SharePoint site, click "Exit Edit Mode." Your CEWP with the embedded JavaScript is now active on your SharePoint site.

Tip

  • check Alternatively, as a best practice, you can develop your JavaScript code using a text editor like Notepad, save it using the .js extension, upload it to a document library in your site collection and then link the CEWP to the script file using the "Content Link" option on the tool pane. One major advantage of this method is reusability. You can use the script in multiple places throughout your site collection, but only have to update or make changes in a single file.

Warning

  • close Creating a Web part with a client-side script like JavaScript can produce unexpected and undesired results that can generate errors within your SharePoint site. Therefore, as a precaution, test your JavaScript code before adding to a CEWP on your SharePoint site.

Items you will need

About the Author

Janice Uwujaren has been writing professionally since 1996. Her articles have been published on various websites. Her experience includes developing content for proposals, websites, training materials and technical documentation. Uwujaren has a Bachelor of Science in computer information systems from Strayer University.

Photo Credits

  • photo_camera Ablestock.com/AbleStock.com/Getty Images