Create sub site and Page using JavaScript jQuery in SharePoint 2016 or SharePoint 2013 or SharePoint Online

InfoPath alternatives for form designing SharePoint

Here we will discuss how we can create a sub site and page using JavaScript, jQuery client object model in SharePoint 2016, SharePoint 2013 or SharePoint online. You can use the below code inside a script editor web part inside a web part page in SharePoint site.

Read some SharePoint 2013 tutorials below:

Title: <input type=”text” id=”txtSitename” /> &nbsp <button type=”button” id=”btnCreateSite” >Create</button>
<script type=”text/javascript” src=”/sites/Intranet/Style%20Library/aaa/jquery-1.8.3.min.js” ></script>
<script type=”text/javascript” src=”/_layouts/15/SP.Runtime.js”></script>

<script type=”text/javascript” src=”/_layouts/15/SP.js”></script>
<script type=”text/javascript” src=”/_layouts/15/sp.publishing.js”></script>



<script type=”text/javascript”>

$(“#btnCreateSite”).click(function(){
CreateWebsite($(“#txtSitename”).val(), $(“#txtSitename”).val(), $(“#txtSitename”).val(), “BLANKINTERNET#2”);
});

var context;
var web;
var newWeb;
function CreateWebsite(title, description, webUrl, templateTitle)
{
context = new SP.ClientContext.get_current();
web = context.get_web();
context.load(web);
var webTemplates = web.getAvailableWebTemplates(1033,false);
context.load(webTemplates);
context.executeQueryAsync(function(){
var enumerator = webTemplates.getEnumerator();
var customTemplate;
while(enumerator.moveNext())
{
var webTemplate = enumerator.get_current();
var webTitle = webTemplate.get_title();
if(webTitle == templateTitle)
{
customTemplate = webTemplate.get_name();
break;
}
}
var webCreationInformation = new SP.WebCreationInformation();
webCreationInformation.set_title(title);
webCreationInformation.set_description(description);
webCreationInformation.set_language(1033);
webCreationInformation.set_url(webUrl);
webCreationInformation.set_useSamePermissionsAsParentSite(true);
webCreationInformation.set_webTemplate(customTemplate);
newWeb= web.get_webs().add(webCreationInformation);
context.executeQueryAsync(function(){
createPublishingPage(“Home.aspx”, “blankWebPartPage.aspx”)
alert(‘Website created successfully.’);
},
function(sender, args){
alert(args.get_message());
});
},
function(sender, args){
alert(args.get_message())
}
);
}

function loadPageLayout (pageLayoutName, callback) {
var pageFromDocLayout, pageLayoutItem;

SP.SOD.executeFunc(‘SP.js’, ‘SP.ClientContext’, function () {
context = SP.ClientContext.get_current();
var site = context.get_site();

context.executeQueryAsync(function () {
var rootWeb = site.get_rootWeb();
context.load(rootWeb, ‘ServerRelativeUrl’);

context.executeQueryAsync(function () {
var rootUrl = rootWeb.get_serverRelativeUrl();
pageFromDocLayout = rootWeb.getFileByServerRelativeUrl(rootUrl + “_catalogs/masterpage/” + pageLayoutName);

context.executeQueryAsync(function () {
pageLayoutItem = pageFromDocLayout.get_listItemAllFields();

context.executeQueryAsync(function () {
if (typeof callback == “function”) {
callback(pageLayoutItem);
}
});
});
});
});
});
};

function createPublishingPage (filename, pageLayoutName, callback) {
SP.SOD.executeFunc(‘SP.js’, ‘SP.ClientContext’, function () {
SP.SOD.executeFunc(‘SP.Publishing.js’, ‘SP.Publishing.PublishingWeb’, function () {
var pubWeb, pageInfo, newPage, listItem;
//context = new SP.ClientContext(‘/sites/Intranet’);

//web = currWeb;
context.load(newWeb);
context.executeQueryAsync(function () {
pubWeb = SP.Publishing.PublishingWeb.getPublishingWeb(context, newWeb);
context.load(newWeb);
context.load(pubWeb);
context.executeQueryAsync(function () {

// load page layout and create the new page
loadPageLayout(pageLayoutName, function (pageLayoutItem) {
pageInfo = new SP.Publishing.PublishingPageInformation();
pageInfo.set_pageLayoutListItem(pageLayoutItem);
pageInfo.set_name(filename);

newPage = pubWeb.addPublishingPage(pageInfo);

context.load(newPage);

context.executeQueryAsync(function () {
// Success callback after adding a new Publishing Page.
// We want to get the actual list item that is represented by the Publishing Page.
listItem = newPage.get_listItem();
context.load(listItem);

context.executeQueryAsync(

// Success callback after getting the actual list item that is
// represented by the Publishing Page.
// We can now get its FieldValues, one of which is its FileLeafRef value.
// We can then use that value to build the Url to the new page
// and set the href or our link to that Url.
function () {
if (typeof callback == “function”) {
callback(listItem);
}
},

// Failure callback after getting the actual list item that is
// represented by the Publishing Page.
function (sender, args) {
alert(‘Failed to get new page: ‘ + args.get_message());
}
);
},
// Failure callback after trying to add a new Publishing Page.
function (sender, args) {
alert(‘Failed to Add Page: ‘ + args.get_message());
}
);
});
},
// Failure callback after trying to get the host Web as a PublishingWeb.
function (sender, args) {
alert(‘Failed to get the PublishingWeb: ‘ + args.get_message());
});
});
});
});


}

</script>


You May Also like the Following SharePoint Online Tutorials:

Leave a Reply