Recently whilst working on an Office 365 SharePoint solution we had a requirement to produce a central hub where users could create pages of various content types, populate fields, pick webparts, pick a location for the new page and view created pages using search.
Initially I thought this would have to be a new page in the provider hosted app we had created for provisioning the site using the Client Side Object Model (CSOM), but I knew JSOM was supposed to have the equivalent CSOM functionality so decided to try it out using this.
Get all subsites
The first thing we want to do is give the user the ability to choose a site to create their page in. To do this we can use SP.Web.getSubwebsForCurrentUserwhich gives us all webs the user has access to. Calling this in a recursive function will allow us to get a tree of sites the user can place their page in.
Get the publishing web
Once the user has chosen a site, we can get the context of that publishing site using SP.Publishing.PublishingWeb.getPublishingWeb. The below is an example of how you would do this:
Getting page layout and creating the page
With any context we can get the site and therefore the root web. Once we have the root web we know where to get our page layouts (rootWeb + “/_catalogs/masterpage/”) and web parts (rootWeb + “/_catalogs/wp/”) from. With the layout and the title of the page the user has selected, we can create the page using SP.Publishing.PublishingWeb.addPublishingPage
Updating the page information & adding web parts
Once our page is created we can get the associated list item using newPage.get_listItem() and then we can populate any available fields, including taxonomy fields, using set_item. If you need to allow users to pick taxonomy field values there are several blog posts available online that cover this topic.
For adding the web parts to the page we can make use of SP.File.getLimitedWebPartManager which will give us the ability to access web parts associated with the page. With the web part manager and the XML of the web part we have access to from the root web (as mentioned earlier) we can now add web parts to the page using addWebPart:
Putting this all together gives us the ability to create our page that meets the requirements mentioned earlier where users can create content, all powered by JSOM.
Once the page is created, fields updated and web parts added we can navigate the user to the page in edit mode for any final tweaks before check-in and publish. Once the page is published it can be crawled and we can extend our central page by also providing the users with any pages they’ve created in a rollup. How can we do this? Search using JSOM of course.
So there we have it. A custom central content creation & content viewing page in Office 365 developed using JSOM. Office 365 development is very easy when you have access to the same server side methods on the client side.
For more information on our SharePoint Development services, take a look here. Have existing SharePoint development requirements? Get in touch with us today.