SharePoint 2013: Working with sp.js files and Publishing pages

So you are trying to write Javascript code in SharePoint 2013 and want to load the sp.js file before your custom function is called. And for that you have used.

ExecuteOrDelayUntilScriptLoaded(“your javascript function”, "sp.js");

But it’s not working. Sad, isn’t it ?

The reason is that, with SharePoint 2013 publishing pages the above syntax doesn’t work. You need to register using the below syntax

SP.SOD.executeFunc('sp.js', 'SP.ClientContext', “your javascript function”);

I struggled 2 hours to find this MSDN article which showed me the right way.

Retrieving SharePoint List Items using Javascript in a Custom Webpart

So you want to fetch list items but do not want any post back, yes we can implement that using Javascript within our custom webpart by using a client control. 

Let me explain that in a step by step process

• Create a new Visual Webart Project in VS 2012.
• Give it a proper name and make it a Farm level solution.
• Now delete the existing Visual WebPart item within the solution (to remove the default name) and add a new item – Visual WebPart and give it the desired name.
• Open ascx file and copy paste the code below

<%@ Assembly Name="$SharePoint.Project.AssemblyFullName$" %>
<%@ Assembly Name="Microsoft.Web.CommandUI, Version=15.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c" %> 
<%@ Register Tagprefix="SharePoint" Namespace="Microsoft.SharePoint.WebControls" Assembly="Microsoft.SharePoint, Version=15.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c" %> 
<%@ Register Tagprefix="Utilities" Namespace="Microsoft.SharePoint.Utilities" Assembly="Microsoft.SharePoint, Version=15.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c" %>
<%@ Register Tagprefix="asp" Namespace="System.Web.UI" Assembly="System.Web.Extensions, Version=4.0.0.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35" %>
<%@ Import Namespace="Microsoft.SharePoint" %> 
<%@ Register Tagprefix="WebPartPages" Namespace="Microsoft.SharePoint.WebPartPages" Assembly="Microsoft.SharePoint, Version=15.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c" %>
<%@ Control Language="C#" AutoEventWireup="true" CodeBehind="VisualWebPart1.ascx.cs" Inherits="TestJavaScript1.VisualWebPart1.VisualWebPart1" %>

 Test 

Here I am using client control and not any server control so there will not be any post back experience.

If you wish you can add more functionality to this same webpart and use it in your real world scenario like adding server controls to it and then writing some code behind for it and so on.