Get All Groups From Site Collection Using PnP JavaScript Library

PnP-JS-Core library contains a number of extensible methods and properties. By using this, we can achieve various actions in a simple code. To know more about this library component, visit the links given below:

• Simplified JavaScript Library for SharePoint
• PnP-JS-Core Library

In this post, we will see how to get all the groups from the Site Collection, using PnP-JS-Core library,

Example

The code snippet, given below, is used to get the group name and the group owner name from the Site Collection , using PnP JavaScript library. Click here to read more. 

<script type="text/javascript" src="/siteassets/scripts/fetch.js"></script>
<script type="text/javascript" src="/siteassets/scripts/promise.min.js"></script>
<script type="text/javascript" src="/siteassets/scripts/pnp.min.js"></script>

<div id="sample"></div>

<script type="text/javascript">
//The below PnP property used to returns all groups from site collection
$pnp.sp.web.siteGroups.get().then(function(data) {
    var groups = "";
    for (var i = 0; i < data.length; i++) {
        groups += data[i].Title + " - " + data[i].OwnerTitle + "<br/>";
    }
    document.getElementById("sample").innerHTML = groups;
});
</script>