Monday, September 11, 2017

SharePoint Framework (SPFx) Client Side Web Part – Learning Path

Will be updated frequently

Introduction

In this post, I will share the learning materials (articles, videos, blogpost, microblog post) with related to SharePoint Framework Client Side Web Part.

Going through these materials will make you a great SharePoint Framework Web Part developer.

Angular JS 1.x with SharePoint Framework client side web part

Angular (Angular JS 2 +) with SharePoint Framework client side web part

Saturday, September 9, 2017

WebHooks in SharePoint Online – Post 1 – Introduction

“WebHooks in SharePoint Online” will be a series of blog posts.

  1. WebHooks in SharePoint Online – Post 1 – Introduction

This is the first post of the series and this post will be on introduction to SharePoint Online WebHooks.

Introduction to WebHooks

WebHooks are HTTP services where the subscribers will notified of events happening. Not only Office 365 or SharePoint uses WebHooks, but it’s a universal model used by Facebook, GitHub, MailChimp etc.

Introduction to WebHooks in SharePoint Online / SharePoint Online WebHooks

WebHooks in SharePoint Online are used for Document Libraries or lists. WebHooks in SharePoint Online are asynchronous event supported, which means that the notification is pushed to subscribers when items are added, updated, deleted or moved. WebHooks in SharePoint Online are not synchronous (“-ing”) event supported. Microsoft recommends Remote Event Receivers for synchronous events.

Why WebHooks over Remote Event Receivers

  • WebHooks are easier to consume by “non-SharePoint” developers

Advantages of SharePoint Online WebHooks

  • Easy to subscribe and push notification
  • Automatic retry is available on failure up to 5 minutes
  • Deleted event is available
  • Universal model
  • Can be used in modern SharePoint development stack such as SharePoint Framework

Disadvantages of SharePoint Online WebHooks

  • The subscription period will be expired automatically in 6 months and the subscribers have to re subscribe.
  • You cannot use webhooks to cancel an operation.
  • SharePoint Online lists and libraries are available.
  • No synchronous method is supported.
  • Acknowledgement must be received quickly within 5 seconds.
  • Subscription and notification uses the same url. The developers should implement their own logics to differ the calls.

Keep in mind when you develop solutions using WebHooks

  • WebHooks are only for asynchronous calls
  • Send the acknowledgement within 5 seconds
  • Implement a way to update the subscription if it is about to expire.

Tuesday, September 5, 2017

Access SharePoint group users from SharePoint Hosted Add-in through Rest API

Introduction

I was using SharePoint rest api in order to read the users from a SharePoint group.

  

   var url = _spPageContextInfo.webAbsoluteUrl + "/_api/web/sitegroups/getbyname('" + groupName + "')/users";


We can use the Add-in web url since the groups are inherited from the parent site (Host web) to the add-in web.

Problem

When a user (other than the site collection administrator) try to access the above rest url, it throws access denied exception.

Access denied when trying to get users from SharePoint group


Solution

Step 1

Go to “People and groups” under Site Setting.

Step 2

Select the group and then go to “Group Setting” under Setting.

image

Step 3

Then select “Everyone” radio button for the "Who can view the membership of the group?" option.

image

Step 4

Click OK

Conclusion

Now other users also will have  the permission to read the users in the group.

image

Friday, August 25, 2017

Add an Attachment to a list item with PnP JS Core library and Dropzone.js

Introduction

I was using ng-dropzone which is a AngularJS directive for dropzone.js and PnP JavaScript Core Library in order to add an attachment for list item.

I was following this url in order setup dropzone.js in my SharePoint hosted add-in.

In order to add an attachment to SharePoint list item please do the below changes.

  1. Replace $scope.dzCallbacks as below
  2.   
          $scope.dzCallbacks = {
                'addedfile': function (file) {
                    console.log(file);
                    $scope.dropZoneFiles.push(file);
                },
                'success': function (file, xhr) {
                    console.log(file, xhr);
                },
            };
  3. Add below function to insert item and add attachment

Since my solution is a SharePoint hosted add-in I’m using crossDomain call and you have to replace your addinWeb and hostWeb url and also your have to change the list name. My list name is “abc”

  
     $scope.saveItem = function () {
          
            $pnp.sp.crossDomainWeb(addinWeb, hostWeb).lists.getByTitle("abc").items.add({
                Title: "Title",

            }).then((result) => {
              
                $scope.dropZoneFiles.forEach(function (file) {
                    var toUpload = file; 
                    
                    var r = new FileReader();

                    r.onloadend = function (e) {
                        var data = e.target.result;


                        item.attachmentFiles.add(toUpload.name, data).then(function () {
                            alert()
                        });
                    }

                    r.readAsArrayBuffer(toUpload);
                    
                    console.log(result);
                });
            }

Conclusion

The item will be created and the attachment will be uploaded.

Monday, August 7, 2017

Sri Lanka SharePoint Forum monthly gathering – August

Come join us on 9th, August 2017 for Sri Lanka SharePoint Forum monthly gathering.

I will be speaking on "Build SharePoint Online Workflows and Customize Forms Using Nintex for Office 365"

Event Url: https://www.facebook.com/events/1531294496931216/?ref=46

20663701_10155529431892482_5738861410474645855_n

Updated On: 09th of August 2017

Slides which used for the event.


Some clicks during the event

Suhail Jamaldeen (1)Suhail Jamaldeen (2)Suhail Jamaldeen (3)Suhail Jamaldeen (4)

Friday, August 4, 2017

SharePoint Modern Page Quick links web part missing Layout option?

Introduction

Some of the Microsoft documented features, which are related Office 365 to are not available for some tenants. I noticed that from SharePoint Online modern experiences – some of the features were missing. Here is the conversation I started.

It’s because my tenant is not configured to First Release

First release candidates receives the Office 365 updates immediately.

Problem

According to support.office.com, Quick links web part in SharePoint Modern Pages should show a "layout" option where we can select either Compact or Film Strip. But my development site and client's site doesn't show such options. Any idea?

My developer site is given below.

Capture.JPG

Solution

I added my tenant to “First release for selected users” in Office 365 Admin Center.

Step 01. Go to Admin Center from the Quick Launch

Step 02. Select “Organization profile” under Setting.

imageStep 03. Under Release preferences, select Edit under Actions dropdown

image

Step 04. Selection the option “First release for selected users” and click Next

image

Step 05. Click Yesimage

Step 06. Then you have to add people. I have added people who are managing sites, because they are the people who are going to customize the sites.  

And then Hit Save

image


Conclusion

Once I did the above configuration, I was able to see the First Release features in my Office 365 Tenant. It may take some time.

image


Wednesday, August 2, 2017

How to request for a code review in Visual Studio - Tamil

This is my first YouTube session related to Technology.

I would greatly appreciate it if you kindly give me some feedback and your feedback will definitely help me a lot in future.