Questions tagged [office-ui-fabric]

The Office UI Fabric is a Microsoft-created collection of UX frameworks you can use to build Fluent experiences that fit seamlessly into a broad range of Microsoft products. Use this tag when your question is specific to the Core of the UI Fabric.

Filter by
Sorted by
Tagged with
0 votes
0 answers
763 views

office Fabric ui people picker picks first value

I am using office fabric UI Normal people picker and its working fine used in similar as what articles says but somehow it always select first value if tap through mouse and on using keyboard arrow ...
Ashok 's user avatar
  • 49
0 votes
1 answer
590 views

Save Checkbox value in SharePoint list item SPFx

I am using below code in SPFx to create checkbox export interface IExampleState { isChecked: boolean; } constructor(props: IExampleProps) { super(props); (this); this.state = { ...
Ashok 's user avatar
  • 49
0 votes
1 answer
770 views

Extra hover CSS on Fabric control in SPFx webpart

For all of my fabric control, I am getting extra hover CSS in my SPFx web part. How can I remove that extra hover? button:hover, input[type=button]:hover, input[type=reset]:hover, input[type=submit]:...
kumar's user avatar
  • 139
0 votes
1 answer
450 views

office fabric Document card css

hi i am using office fabric UI to show Document card as Tiles below is my code i want icon should come at center and text at bottom in Yellow bar const cardStyles: IDocumentCardStyles = { root: ...
kumar's user avatar
  • 139
0 votes
1 answer
545 views

How to disable a MS Fabric checkbox when already one is selected in a group

I am using MS-Fabric checkbox component and I want to uncheck a checkbox when another is selected. Cant use radio as this is not a mandatory field. ...
shubham rathi's user avatar
0 votes
1 answer
256 views

Are these FabricUI components still supported and can i use them?

I'm investing and trying out some of these components in my web part (classic page) The Persona Card https://developer.microsoft.com/en-us/fabric-js/components/persona/persona Ref below https://...
naijacoder's user avatar
  • 4,260
1 vote
1 answer
2k views

Office UI Fabric verticle align middle not working

I am trying to make my image vertically aligned in middle using CSS which is not working in Office UI Fabric. My HTML Code: <div class="ms-Grid" dir="ltr"> <div class="ms-Grid-row"> ...
Milind's user avatar
  • 1,538
0 votes
1 answer
4k views

Fabric UI DetailsList component - Dynamically load group items

I'm using grouped DetailsList Fabric UI component in custom SPFx webpart for displaying list data. https://developer.microsoft.com/en-us/fabric/#/controls/web/detailslist/grouped I need to load ...
Dmitry S's user avatar
0 votes
1 answer
774 views

Office UI Fabric not loaded with SharePoint 2016 | SPFx

I have sharepoint 2016, and i am trying to load the property panel of spfx webpart, however it's loaded without fabric icons. For example the Back and Next buttons look like this: Is there a way to ...
Dan's user avatar
  • 21
0 votes
1 answer
269 views

SP Online - custom Display Template - square boxes instead of font icons from Office UI Fabric icon set displayed in checked-in state

I encountered a problem, that it displays only empty square boxes instead of nice (custom font) images from generated Office UI Fabric icons set, since I change the state of the with the web-part to ...
rychlmoj's user avatar
  • 239
0 votes
1 answer
211 views

Disable Fabric UI JS Dialog Auto-Refresh

I am using the Fabric UI JS components on a SharePoint 2016 project (not using React or SharePoint Framework) and having issues with the dialog box buttons refreshing the page upon click. Reviewing ...
BWieland86's user avatar
1 vote
1 answer
2k views

SPFx - Using UI Fabric Core Controls without React Framework

Just wanted to check If I am not missing something. I wanted to use Office UI Fabric core controls on SPFx webpart without React component. So basically I have option to use SP Fabric Core. https://...
Siddharth Vaghasia's user avatar
1 vote
1 answer
557 views

Office UI Fabric - Button component post back after click

I am creating a sample form using Office UI Fabric components, I can see button component rendered but when I click on the button I get page posted back. I have a simple html button as well but that ...
Ali's user avatar
  • 913
1 vote
1 answer
2k views

DetailsList component row rendering issue

There is a DetailsList component inside spfx webpart, which loads all the documents/files using PnP. There is a office-ui-fabric-react check out button outside DetailsList component. When I select ...
Satya R's user avatar
  • 11
1 vote
0 answers
349 views

Set current user in Fabric.UI people picker

I'm struggling setting the current user to a people picker control in Office.Fabric.UI const people: (IPersonaProps & { key: string | number })[] = [ { key: 1, imageInitials: 'PV', ...
djHonda's user avatar
  • 43
3 votes
1 answer
6k views

Office UI Fabric Dropdown event onChange not working

I am creating SPFx component with React framework. For UI I am using Office UI Fabric controls. During my development I have found that "Dropdown" control's onChange event is not firing Based on ...
Ravi Khambhati's user avatar
0 votes
0 answers
327 views

office UI fabric react in sharepoint web part

I am currently developing a web part using the SPfx. Wnated to know how can we edit or override the styles for office UI fabric react ? Thanks in advance. BreadCrumb.module.scss @import '~@...
Brijesh Kothari's user avatar
1 vote
1 answer
241 views

How to make use of attachments and additional columns in modern event webPart new/edit forms?

I added a multi-lookup field to the standard event list on a modern experience communication site. Unfortunately the standard "New item form" does not show it. My idea is to display the classic ...
elsni's user avatar
  • 471
0 votes
1 answer
448 views

collapseByDefault not working in Nav-component from Office UI Fabric

I try to build a navigation with spfx. Its working fine but I want to have the navigation collapsed. It seems that the property is not assigned or recognized by SPFx (it is running but with no effect)....
Oskar's user avatar
  • 308
1 vote
0 answers
129 views

Instructor led training for SPfx and SharePoint PnP? [closed]

Does anyone know of instructor led training for working with SPfx and SharePoint PnP/Office UI Fabric? I'm looking to get a jump on SharePoint Online development.
Jehoshaphat's user avatar
0 votes
1 answer
2k views

Fabric UI Navbar components- How to swtich to horizontal layout?

How can i switch this component Nav Fabric UI to change the layout to horizontal instead of vertical. Are there any other Fabric UI components i can use a a menu horizontally? Thanks in advance
naijacoder's user avatar
  • 4,260
1 vote
1 answer
860 views

SPFX design using office-ui-fabric

I am new to spfx and I have been trying to get the office-ui-fabric design for my elements in the spfx application. So I have started with the design of a button. I have done the following steps to ...
KumarV's user avatar
  • 2,680
1 vote
0 answers
352 views

Separate file for html in SPFX

I am new to SPFX ad I am trying to create a separate file for my html code which I have done by doing this.domElement.innerHTML = require("./Index.html"); But I am not able to get the design that ...
KumarV's user avatar
  • 2,680
1 vote
1 answer
266 views

ngOfficeUIFabric or office-ui-fabric-react

kind of newer on office 365 and SPFX ? Im tring to use OfficeUIFabric, im in front of two choices : ngOfficeUIFabric or office-ui-fabric-react the decision isnt easy, so i need your feedbacks on ...
Imen Turki's user avatar
  • 2,183