SharePoint Widgets

Hi Friends, This post is not regarding the SharePoint but it is a very common functionality that we need in day to day coding. So I thought to write down here. This functionality is of sorting in Typescript. Sorting simple Arrays Sorting is the very basic functionality that is required and when it comes to typescript  we do get OOB method, but that is for the simple array.    let  fruits : string []  =  [ ' Banana ' ,  ' Orange ' ,  ' Apple ' ,  ' Pineapple ' ] ;    console . log (fruits. sort ()); Output : Apple, Banana, Orange, Pineapple Sorting an Array of Objects When it comes to sorting the array of objects, we do not have any OOB method which can serve our purpose. for this, we have to write our small custom logic within the sort method let  fruits :   any []  =  [{ Name :   ' Banana '  }, { Name :   ' Orange '  },  { Name :   ' Appl...

Hi Friends, Most of the time when we are working on the SharePoint Framework or SPFx solutions, the version of each component can create issues while building the solutions. One of the common issues is with the SPFx version. SPFx version is the version of the SharePoint Framework yeomen generator installed on your machine. With the difference in the version, a solution might differ in the import versions of other libraries, change in solution scaffolding, and more... ➡️Steps to know your SPFx version Open the console  Type in the following command  npm ls -g --depth=0 @microsoft/generator-sharepoint Hit enter and wait for a few seconds. You'll get the response   Happy Coding #Microsoft #SharePoint #SharePointWidgets

Hi Friends, Today I will talk about the most useful VS Code extensions, that will help in the productivity of specifically SharePoint Framework projects. As a developer, we waste a lot of time in the tasks that could be done easily via extensions support or shortcut keys. In this blog post, I will discuss some of these extensions that will increase the productivity and the style of your code. With an increase in productivity, the styling also holds an important value as it makes the code more readable and understandable which increases the focus time. So let's dive then !! VS Code Extensions !! Debugger for Chrome:  A very important extension if you are a SharePoint online developer (developing SharePoint framework components) then it is a must to have this extension. This extension helps in debugging the SharePoint Framework components just as we used to do in the C# server-side coding. For details on how to configure, you ca...

Hi Friends, Many times we need to show the controls based on the user permission while creating the custom SharePoint Framework (SPFx) webpart. The first thing we look for is the endpoint to retrieve the information from SharePoint. In this blog I will tell you how this can be achieved without any endpoint as this information is already available in the SharePoint Framework (SPFx) webpart. So, if you look into the <WebpartName>webpart.ts file , you can find this information in the current page context this .context.pageContext.web.permissions Now we get three methods with this hasAllPermissions : Checks if the user has all the permissions hasAnyPermissions : Checks if the user has any permission from the collection of permissions hasPermission : Checks if the user has given permission value : Returns the current user permission set Now talking of the permissions, you'll get a variety of permissions. For this SharePoint has the SPPermission class. ...

Hi Friends, In this blog I will be creating a cascade drop down in the webpart properties of a SharePoint Framework - SPFx webpart. In my previous post I have shown how to create a dynamically populated dropdown in the SharePoint Framework SPFx webpart . This blog will be in continuation to that, where I will be extending the previous example to populating the list in the dropdown. In this example I will be showing all the "Views" for the selected list. As we usually comes with the scenario where we need the cascade dropdown. For full code files you can refer here on github. Step 1: Setting up your SharePoint environment If you have not yet setup your SharePoint environment , then refer to my previous blog on Setting up your SharePoint environment . Step 2: Creating a empty SharePoint Framework Project Create a empty SharePoint Framework project. If you are new than refer to my previous article on Set up your new SPFx project .  Step 3: Ins...

Hi friends, By default when you create a full width layout we can have only 2 web part by default Image WebPart Hero WebPart So it becomes very difficult if you are creating some webpart which needs to be shown as a full width webpart..  Now the good news is that , it is now possible to show your custom control creating in SharePoint Framework to be shown on the full width. With just minor changes you can achieve this. Open your webpart's manifest file and add the property " supportsFullBleed: true ". This property will allow the webpart to be shown as an option in the full width. Below is the config file where change needs to be made As shown in the image below the webpart is shown as an option. Happy Coding - Sumit Kanchan

Hi Friends, We usually have to add the dynamic values to the web part properties. In this blog I will be showcasing the how you can add the dynamic values to the web part properties. In this blog I will showcasing how you can fill in the drop-down values with the Title of the lists. All the lists will be fetched and then will be added to one of the web part properties. On selection of the drop-down you can see the list selected. Step 1 : Create an empty SharePoint project .  To learn how to create SharePoint Framework Project you can refer to my previous post Setup your new SPFx Project . If you have not setup your environment you can refer my blog  3 Steps to Setup your SharePoint Framework Environment . In my case I have crated Project with the name " spfx-dynamic-values-in-web-part-properties " WebPart with the name " demoDynamicValuesInWebP...