How to Add a JS Link Reference to the Display Form or Any other ASPX Programmatically using CSOM PNP in SharePoint Office 365

Sathish Nadarajan
SharePoint MVP
Published On :   21 Oct 2016
Visit Count
Today :  8    Total :   4648
Plan, Migrate, Secure, Report
SharePoint & Office 365 Tool. Simple & Easy to Use. 15-Day Trial!

Sharegate: Kick-Ass Tool
Think Your SharePoint & Office 365 Are Secure ? Find Out Now!

In the last article, we saw how to Insert the JS link on the default NewForm and EditForm.JS. With some curiosity, I was about to add the Same JS file to any page apart from the default PageType option shared by Patterns By Practices.

By default, PNP Supports the following Page Types.

Invalid = -1,

DefaultView = 0,

NormalView = 1,

DialogView = 2,

View = 3,

DisplayForm = 4,

DisplayFormDialog = 5,

EditForm = 6,

EditFormDialog = 7,

NewForm = 8,

NewFormDialog = 9,

SolutionForm = 10,


I wanted to extend this to some other Files also. i.e., Coming up with an Extension Method similar to the PNP, which will get any URL within that list and the JS Link.

For that came up with a static class.

 public static class JSLinkCustomizationUtility
         public static void SetJSLinkCustomizationsCustom(this List list, string ServerRelativeUrl, string jslink)
             // Get the list form to apply the JS link
             Microsoft.SharePoint.Client.File file = list.ParentWeb.GetFileByServerRelativeUrl(ServerRelativeUrl);
             LimitedWebPartManager wpm = file.GetLimitedWebPartManager(PersonalizationScope.Shared);
             list.Context.Load(wpm.WebParts, wps => wps.Include(wp => wp.WebPart.Title));
             // Set the JS link for all web parts
             foreach (WebPartDefinition wpd in wpm.WebParts)
                 WebPart wp = wpd.WebPart;
                 wp.Properties["JSLink"] = jslink;

And the Usage will be something like, below.

 static void Main(string[] args)
         public static void AddJSLinkReferencceInDefaultView()
             OfficeDevPnP.Core.AuthenticationManager authMgr = new OfficeDevPnP.Core.AuthenticationManager();
             string siteUrl = "https://******";
             string userName = "Sathish@******";
             string password = "******";
             using (var ctx = authMgr.GetSharePointOnlineAuthenticatedContextTenant(siteUrl, userName, password))
                 Web web = ctx.Web;
                 List list = web.Lists.GetByTitle("MyList");
                 list.SetJSLinkCustomizationsCustom(list.DefaultView.ServerRelativeUrl, "https:// ******");

Happy Coding,

Sathish Nadarajan.

SharePoint Usage Reports
Usage reports, collaboration and audit for SharePoint.

KWizCom Forms App