1

I'm trying to create a basic Web Part page using JSOM for SharePoint 2013 and in this page I want to add a CEWP.

Could someone direct me in the right direction on how to do this?

2

Creating a SharePoint Wiki Page via JavaScript and REST or CSOM

function createWikiPage(webUrl,listTitle,fileName,success, failure)
{

  getListUrl(webUrl,listTitle,
    function(listUrl){  

     var fileUrl = listUrl + '/' + fileName
     var url = webUrl + "/_api/web/GetFolderByServerRelativeUrl('" + listUrl + "')/Files" +
               "/AddTemplateFile(urlOfFile='" + fileUrl + "',templateFileType=1)";
     $.ajax({
        url: url,
        method: "POST",
        headers: {
               "accept": "application/json;odata=verbose",
               "content-type": "application/json;odata=verbose",
               "X-RequestDigest" : $("#__REQUESTDIGEST").val()
        },
        success: function (data) {
            success(data.d);
        },
        error: function (data) {
            failure(data);
        }
     });

    },
    failure
  );


}


function getListUrl(webUrl,listTitle,success, failure)
{
    var url = webUrl + "/_api/web/lists/GetByTitle('" + listTitle +  "')/RootFolder"; 
    $.ajax({
        url: url,
        method: "GET",
        headers: {
               "accept": "application/json;odata=verbose",
               "content-type": "application/json;odata=verbose"
        },
        success: function (data) {
            success(data.d.ServerRelativeUrl);
        },
        error: function (data) {
            failure(data);
        }
    });
}


//Usage
createWikiPage(_spPageContextInfo.webAbsoluteUrl,'Pages','WikiTestPage.aspx',
  function(page){  
    console.log(JSON.stringify(page));
  },
  function(error){
    console.log(JSON.stringify(error));
  }
);

function addWebPart(webUrl, pageUrl,webPartXml,zoneId,zoneIndex, Success,Error){
    var context = new SP.ClientContext(webUrl);
    var web = context.get_web();

    var file = web.getFileByServerRelativeUrl(webUrl + pageUrl);
    var webPartMngr = file.getLimitedWebPartManager(SP.WebParts.PersonalizationScope.shared);
    var webPartDef = webPartMngr.importWebPart(webPartXml);
    var webPart = webPartDef.get_webPart();
    webPartMngr.addWebPart(webPart, zoneId, zoneIndex);

    context.load(webPart);
    context.executeQueryAsync(
      function() {
        Success(webPart);
      },
      Error
    );
}

Is it possible to programmatically add a web part to a page in a sharepoint hosted app (JS)

var webPartXml = '<?xml version="1.0" encoding="utf-8"?>' +
'<WebPart xmlns="http://schemas.microsoft.com/WebPart/v2">' +
    '<Assembly>Microsoft.SharePoint, Version=16.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c</Assembly>' + 
    '<TypeName>Microsoft.SharePoint.WebPartPages.ContentEditorWebPart</TypeName>' + 
    '<Title>$Resources:core,ContentEditorWebPartTitle;</Title>' +
    '<Description>$Resources:core,ContentEditorWebPartDescription;</Description>' +
    '<PartImageLarge>/_layouts/15/images/mscontl.gif</PartImageLarge>' +
'</WebPart>';

addWebPart('/','Pages/default.aspx',webPartXml,'Left',1,function(webPart){
    console.log(webPart.get_title() + ' has been added'); 
},function(sender,args){
    console.log(args.get_message());
});
2

You can add this entire block and edit it to your liking inside your CEWP. Instead of the alert, you can use something like writing html, and appending it to a container. This snippet came directly from: https://msdn.microsoft.com/en-us/library/office/jj163201.aspx

function retrieveListItems(siteUrl) {
    var clientContext = new SP.ClientContext(siteUrl);
    var oList = clientContext.get_web().get_lists().getByTitle('Announcements');

    var camlQuery = new SP.CamlQuery();
    camlQuery.set_viewXml(
        '<View><Query><Where><Geq><FieldRef Name=\'ID\'/>' + 
        '<Value Type=\'Number\'>1</Value></Geq></Where></Query>' + 
        '<RowLimit>10</RowLimit></View>'
    );
    this.collListItem = oList.getItems(camlQuery);

    clientContext.load(collListItem);
    clientContext.executeQueryAsync(
        Function.createDelegate(this, this.onQuerySucceeded), 
        Function.createDelegate(this, this.onQueryFailed)
    ); 
}

function onQuerySucceeded(sender, args) {
    var listItemInfo = '';
    var listItemEnumerator = collListItem.getEnumerator();

    while (listItemEnumerator.moveNext()) {
        var oListItem = listItemEnumerator.get_current();
        listItemInfo += '\nID: ' + oListItem.get_id() + 
            '\nTitle: ' + oListItem.get_item('Title') + 
            '\nBody: ' + oListItem.get_item('Body');
    }

    alert(listItemInfo.toString());
}

function onQueryFailed(sender, args) {
    alert('Request failed. ' + args.get_message() + 
        '\n' + args.get_stackTrace());
}

retrieveListItems("http://siteurl");

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.