Roland Oldengarm - Independent IT Contractor

Living in the coolest little capital Wellington, New Zealand!

Page 3 of 6

How to use the Office UI Fabric directives ngOfficeUIFabric in a Windows 10 Universal App

In 2015 Microsoft released the Office UI Fabric, which allows developers to create web applications and SharePoint / Office add-ins that look and feel like Office. Microsoft was / is using this internally as well, they open-sourced it so the community could benefit from it. Essentially, the Office UI Fabric is a set of CSS style sheets.

They also released a set of components like a textbox, dropdown, date picker, table, etc. but they’re not part of the Office UI Fabric. They are a set of HTML files you’d have to copy / paste to your application, include the example JavaScripts, and you would have your textbox or date picker. This is not very straightforward. Luckily there is a solution. The popular JavaScript framework Angular allows you to create custom directives, which makes it possible to create new HTML tags with code that attaches behaviors. The open source ngOfficeUIFabric, started by Andrew Connell, has the goal to transform all Office UI Fabric Components to Angular Directives. I am part of this team as well, and I’ve built the Choicefield, Dropdown, Textfield, and Toggle.

In this blog post I am going to show you how you can leverage ngOfficeUIFabric in a Windows 10 Universal App! Windows 10 apps are available in 2 options: XAML based and HTML based. The latter allows us to build our app like a website, and deploy as a native app!

Continue reading

A quick overview of the new Office 365 Planner

When the new Office 365 Planner was announced in September 2015, I was very excited. This was one of the key features I think was missing from Office 365. We are using Microsoft products only, e.g. Office 365, SharePoint, Visual Studio Online, etc., but we were still using Trello in certain projects for task boards.

It was supposed to roll out to first release tenants in Q4 2015, but it took until January 2016 before it was available at my demo tenant. And now I’m going to give you a quick overview of what Office 365 Planner is!

Office 365 Planner offers a highly visually appealing experience to organize teamwork.

Continue reading

Angular Directives and Transclude: Select works differently

Together with a great team of Office UI Fabric enthusiasts I’m working on building Angular Directives for the Office UI Fabric. Check out the Github repository for more information.

As part of web applications I’ve built, we’ve been using Angular more and more in the last couple of years. Angular allows you to build custom directives, in most cases used to create new HTML elements. In the light of the Office UI Fabric, I have for example built directives for the Textfield, Toggle, and Dropdown control. With the latest one, the Dropdown control, I’ve ran into a very weird issue with transclusion.

Continue reading

How to create a jqgrid of your SharePoint data


  • Leave requests stored in SharePoint (Office 365)
  • Leave applicant data (staff number, employee type, etc.) stored in Azure
  • Show the leave requests of the last two weeks in a grid, being able to edit the data locally & generate a custom export file.

Continue reading

Presentation: What is Office 365?

Rebecca Gordon and I have presented at the SharePoint User Group in Wellington. Rebecca is a colleague at Provoke Solutions. See the Meetup for more information, download the presentation here.

ADAL Cordova, Android => Loading?

We are developing an app for Cordova. It will authenticate against Azure AD, and we are using the ADAL library for Cordova. To test this is working, we did a proof of concept, and thas was all working fine.

When testing it in our “production” app, it did not work. When kicking off the authentication with this code:

var ctx = new Microsoft.ADAL.AuthenticationContext(authority);
ctx.acquireTokenAsync(resourceUrl, appId, redirectUrl).then(function (authRes) {

… it did no longer work on Android. On Windows 8.1 it was fine. On Android it opened a new window for the authentication screen, but it was stuck at “Loading”. Nothing in the JavaScript console either. So, I stripped all the includes out of the HTML, until I finally had the identical HTML + JS as the working proof of concept.

So, it must be something in the Android settings. I compared them, and it turned out “Keep running” was turned off in the “Production” app, and turned on in the working POC. I enabled that and now it is working… This setting can be found by opening config.xml => Android. In the XML it is:

<preference name=”KeepRunning” value=”True” />

TechNet is wrong; You CAN add add-ins to Word Online

After some confusion and discussion on Yammer and TechNet forums, I found out that TechNet has published an article that has incorrect information. According to this article you cannot add Add-ins to Word Online, only to the desktop client.

Office Add-ins
You can get an add-in for Word from the Office Store. Office add-ins only work in the Word desktop app and are not available in Word Online. Learn how to get an add-in for Word.

I first trusted this information, but then I found out it’s wrong. You can add add-ins to Word Online, similar to Word Desktop! It is also possible to add add-ins to Word for the iPad, but I haven’t seen this working yet.

I’ll demonstrate how to make a custom add-in available to Word Online.

Continue reading

Angular ADAL JS + SharePoint REST API in non-root site collections

I’ve been struggling with the following. I’m building a SPA Office Add-in, which communicates with Office 365, using the (awesome) ADAL JS libraries. My app queries the SharePoint Search and downloads files.

As a starting point, I’ve been using this example:

To access the REST API endpoints I was using Angular $http, so I don’t have to worry about adding access tokens to the requests. It was all working fine, until I wanted to access files in non-root site collections. I saw a HTTP/401 in Fiddler, but the access token was attached, so that seemed weird. The response was:

{“error”:”invalid_client”,”error_description”:”Invalid audience Uri ‘{azure_app_id’.”}

… where azure_app_id is my Azure Application ID.

Continue reading

How to get a Yammer Like counter on your page

We have an Office 365 portal and our client wanted to have a Yammer Like button. Alright, that’s easy! Add the Yammer Embed Like and we are done.

The client came back and said: Ah that looks good, but could you also please add the number of likes?
And there is where this blog post is about: Because it’s impossible to get the number of likes, created by the Yammer Like Embed. I have implemented a solution, without a custom database, and is working like a charm. It takes some time though…

Continue reading

How to properly embed a Yammer poll in SharePoint or Office 365

We had the requirement to embed a Yammer poll in SharePoint. This poll would be shown on the homepage of an Office 365 portal. With the Yammer WebPart deprecated, there are two options: Use the REST API, or use the Yammer Embed. We initially tried it with the Yammer Embed, but that is too limited. It only allows to display a certain feed, and has no filter options. The only way to show only one item is to use a Topic feed, and only tag one poll with that Topic. Another showstopper was that we could not apply our styling to the Yammer embed, as it’s hosted in an iframe with no options to style it. It was also annoying that the user had to log in / authenticate every time the browser was closed & reopened.

On the other hand, the REST API has no official documentation around polls. It is possible to retrieve the poll(s), but officially it’s not possible to submit votes. However, I found a solution with the REST API and impersonation with a server-side stored token. This would mean that a user would not have to log in, it would always work.

There are three steps:

  1. Create a Yammer App
  2. Retrieve a test access token as a Yammer Network Admin
  3. Create a SharePoint Provider Hosted add-in, in my case I’ve chosen for MVC.

Continue reading

« Older posts Newer posts »