SharePoint

Create SharePoint sub site using Rest API

In this article you are able to see how to create sub site using Rest API.
We created a custom page and designed UI as per the below, Add this code in the script editor web part.
Create SharePoint Sub site using Client object model

<html>
<head>
<script type="text/javascript" src="https://code.jquery.com/jquery-2.1.0.min.js"></script>
<script type="text/javascript" src="https://ajax.aspnetcdn.com/ajax/4.0/1/MicrosoftAjax.js"></script>
<script type="text/javascript">
$(document).ready(function () {
bindButtonClick();
});
function bindButtonClick() {
alert('startbtnclick');
$("#register").on("click", function() {
var name = $("#txtSiteTitle").val();
var id = $("#txtSiteDescription").val();
var URL = $("#txtSiteURL").val();
if (name == '' || id == '' || URL == '') {
alert("Please fill all fields...!!!!!!");
} else {
createSite();
}
});
}
function createSite()
{
var siteTitle = $("#txtSiteTitle").val();
var siteDesc = $("#txtSiteDescription").val();
var siteUrl = $("#txtSiteURL").val();
$.ajax({
url: "https://dotnetsharepoint.com/Test/_api/web/webinfos/add",
type: "POST",
headers: {
"accept": "application/json;odata=verbose",
"content-type": "application/json;odata=verbose",
"X-RequestDigest": $("#__REQUESTDIGEST").val()
},
data: JSON.stringify({
'parameters': {
'__metadata': {
'type': 'SP.WebInfoCreationInformation'
},
'Url': siteUrl ,
'Title': siteTitle ,
'Description': siteDesc ,
'Language': 1033,
'WebTemplate': 'sts',
'UseUniquePermissions': false
}
})
});
}
</script>

</head>

<body>
<div class="container">
<div class="main">
<form class="form" method="post" action="#">
<h2>Create Client sub Site</h2>
<label>Client Site Name :</label> <input type="text" name="dname" id="txtSiteTitle">
<label>Client Site Description:</label> <input type="text" name="demail" id="txtSiteDescription">
<label>Client Site URL: </label> <input type="text" name="durl" id="txtSiteURL">
<input type="button" name="register" id="register" value="Submit"> </form>
</div>
</body>

</html>

Get data from SharePoint Online list using Rest api & Angular JS

In this article you can see how to bind data from list using Rest API and Angular JS.

We are having a list with name "InfoList”, in the page we added the script editor and added the below code.

What is difference between AngularJS and Angular 2
<style>
table, td, th {
    border: 1px solid blue;
}

th {
    background-color: Green;
    color: white;
}
</style>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.1/angular.min.js"></script>
<script type="text/javascript" src="http://code.jquery.com/ui/1.10.3/jquery-ui.min.js"></script>
<script>

    var myAngApp = angular.module('SharePointAngApp', []);
    myAngApp.controller('spCustomerController', function ($scope, $http) {
        $http({
            method: 'GET',
            url: _spPageContextInfo.webAbsoluteUrl + "/_api/web/lists/getByTitle('InfoList')/items?$select=Title,Employee,Company",
            headers: { "Accept": "application/json;odata=verbose" }
        }).success(function (data, status, headers, config) {
            $scope.customers = data.d.results;
        }).error(function (data, status, headers, config) {

        });
    });


</script>

<h1> Angular JS SharePoint REST API !!</h1>

<div ng-app="SharePointAngApp" class="row">
    <div ng-controller="spCustomerController" class="span10">
        <table class="table table-condensed table-hover">
            <tr>
                <th>Title</th>
                <th>Employee</th>
                <th>Company</th>

            </tr>
            <tr ng-repeat="customer in customers">
                <td>{{customer.Title}}</td>
                <td>{{customer.Employee}}</td>
                <td>{{customer.Company}}</td>
                </tr>
        </table>
    </div>
</div>


        });
    });

</script>

Create SharePoint sub site using Rest API

Get data from SharePoint Online list using Rest api & Angular JS

Labels