SharePoint Widgets

 Hi Friends, With the introduction of SharePoint list view formatting, I have realized that the scope of playing with the lists has also increased. I was working on one of the list view formatting and thought how if someone wants to export the list items to a Microsoft word? For example, if one creates the FAQ in a SharePoint list, it can be made visibly beautiful using the list view formatted, but if they need to export the same in a word document then? So I came up with the idea of exporting the SharePoint List items in the Microsoft Word format and created an extension which with one click exports the list items in the Microsoft Word. for source code click here. Features..!! Exports all the list items from the SharePoint list to the Microsoft Word with beautiful formatting. Want to export only a few items? Just select the items and click on the export and it will export only the ones you want. Export the items with fields based on the current view fields If the view contains exa...

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, This time I have worked upon a tab control which is still missing from Microsoft sample collection. I personally felt this tab control webpart can be of use in many scenarios. I have used the Rich Text editor for the implementation, where whenever a new tab is added , the text editor automatically gets associated with the tab. Since it is the rich text editor so you can do almost everything you want to display with all the custom formatting options available. Source Code on GitHub Features ! No configuration for the webpart to use Safe and fast as there is no external saving of data Rich Text editor increases lot of possibilities how you use it Light weight control Installation $ npm install $ gulp clean $ gulp bundle --ship $ gulp package-solution --ship Below are some of the images that demonstrates the webpart. View Mode Edit Mode Please provide your comments , if you need any more feature or how you like the control. Hap...

Hi Friends, In today's blog I will be explaining how to create a custom control for Property pane in SharePoint Framework, Many times we need a functionality which we cannot be fulfilled using the OOB (out-of-box) controls. For which we have to go with the customized solution. A very basic need that I encountered and will showcase in this blog is the display of colored text with some sort of icon in the Property Pane. For this we can use label but you cannot change the color of the text and there is no property to handle the icon class as well or you cannot add custom css based on the logic. So to demonstrate and understand how the custom control can be created and functions in Property pane of a SharePoint Framework solution. To implement this functionality I will be extending the properties of a Label and adding some more properties to achieve the functionality. Let's start with the structure and it's explanation then we'll move through the code inside ...

Issue: Whenever you are making query to the SharePoint online using the REST API and your query is based on the time stamp, remember that SharePoint treat your time as the GMT timezone. So if you want to fetch information based on local time zone which we usually do, always set the offset and also include the daylight saving. The same is true even you are trying to put in some data to the SharePoint. You will be saving the local timezone but SharePoint will consider it as GMT time zone , and there you won’t be able to save/retrieve the correct records based on the time zone. Solution Solution is simple. SharePoint Framework webpart/extension offers this capability OOB, but there were no articles i was able to find. // will get the final offset in minutes    let finalOffset : number = this . context . pageContext . web . timeZoneInfo . offset + this . context . pageContext . web . timeZoneInfo . daylightOffset    // Now set th...

Hi Friends, Now enjoy with work. Play tic-tac-toe and give your mind a bit relaxing so you can energize yourself for the tough job you do all day in office. Click here to get the Source Code This webpart is created for fun during work, so whenever you get exhausted with work , you can easily relax yourself and make yourself ready again for the heavy duty in the office. WebPart Features !!! Game Stats: Keeps the record of the total games you played, you won and also the computer won Even if you need to navigate to the page , don’t worry you’ll not loose your scores Don’t underestimate your opponent Fully responsive, so no matter on which device you play Click here to get the Source Code Configuration Configuration is pretty simple as you only need to install the webpart in your tenant and done. No access required for the SharePoint object so no need to worry for security. Click here to get the Source Code Dep...