Questions tagged [office-fabric]
79 questions
1
vote
1 answer
Jquery append in Office select input
I have a HTML Select with the office UI Fabric classes :
1
vote
0 answers
Office fabric ui Server side rendering in a node server
I'm making a single MERN app for training and i though use Office Frabric UI could be a good idea.
I'm using server side rendering for my app but i am getting this error when i use a single …

SalahAdDin
- 2,023
- 25
- 51
1
vote
1 answer
How do you style a office fabric react component?
I can't figure out how to style the fabric ui component. I just want to change the background of the nav bar to be black with white phone instead of white background and black font. However, this seems to be really difficult with the current…

darewreck
- 2,576
- 5
- 42
- 67
1
vote
1 answer
Applying css or manipulating and DOM elements of office js dialoque
I want to increase the height of div inside the div with class=ms-Dialog-content content_49e4f91a which is present inside the iframe .
Is there any way to apply css inside an office.js dialog?
Please suggest.Thanks.

Leo
- 163
- 13
1
vote
0 answers
Office Fabric React Nav Icons not shown and iconClassName not being applied
My nav items need to have colour and icon changes.
I'm finding however that the set of icons I seem to have and the iconClassName do not seem to be being shown
{
key: 'upload',
name: 'MAU',
icon: 'AlertSolid',
iconClassName:…

awjr
- 616
- 6
- 8
1
vote
1 answer
Office Fabric: Enabling user to re-select the same row in DetailsList
For DetailsLists, "onActiveItemChanged" doesn't work well for opening up a modal dialog for that item as a second click on the same row (after closing the model dialolg) is ignored as the activeItem hasn't changed. "onItemInvoke" isn't great…

Lars
- 9,976
- 4
- 34
- 40
1
vote
2 answers
Remove Click handler from fabric dialog overlay
I'm using Office-Fabric-Ui and its dialog functionality.
var template = $("
This is modal dialog content
");
var uidialog = new fabric["Dialog"](template[0]);
Now, uidialog has _overlay variable, on click of this _overlay…
Vishnu
- 2,135
- 2
- 30
- 51
0
votes
1 answer
get/retrieve the value/data-attribute of the selected option from dropdown in office ui fabric core
I am adding the option list using jquery to my drop-down and my option looks like this
I want to retrieve the "value" of the option that I have selected from…

Enab
- 41
- 5
0
votes
1 answer
onGetErrorMessage not being called for FluentUIReact TextField
I was going through fabric UI TextField documentation(https://developer.microsoft.com/en-us/fluentui#/controls/web/textfield ) . I tried few examples of TextField with the following two handlers:-
onChange
onGetErrorMessage.
I tried few…

Nishchay Suteri
- 1
- 1
0
votes
1 answer
How to center button in Fluent UI Dialog component?
Dialog component in Fluent UI has DialogFooter. I want to place a button inside that footer and I want it to be in the center. How can that be achieved? I'm unable to move it from its default location.
Sample code (taken from [official…

Alcibiades
- 335
- 5
- 16
0
votes
1 answer
Close button not having "X" in Fluent UI
I'm trying to create a TeachingBubble using Fluent UI. I want it to have close button, marked with "x".
I'd like to have a closing button like in this example:
How can that be done in react, using Fluent UI?
My current code:
import { TeachingBubble…

Alcibiades
- 335
- 5
- 16
0
votes
1 answer
Fabric DetailsList change child row controls based on parent row
I've a details list as shown below.

shashank
- 123
- 9
0
votes
1 answer
How to style new @fluentui/react-button [v8 beta]?
Is there any documentation on how to apply style customisations to the new Button? The styling using the IButtonStyles interface is broken on the new button, as per code below.
import { PrimaryButton } from '@fluentui/react';
import { Button as…

David Min
- 1,246
- 8
- 27
0
votes
1 answer
Fabric/Fluent UI Details List: Highlight column when clicked on the Header
Is there a way to highlight the whole column or at least the header in DetailsList when clicked, with a condition that only 1 column can be selected at a time?
Changing the class inside 'onColumnHeaderClick' works but, it doesn't make the columns…
0
votes
1 answer
how to add custom html attribute with fabric react nav component?
I am using
import { Nav } from 'office-ui-fabric-react';
function CustomNav(props) {
return ;
}
For nav object, I want to add custom html…

Ronak SHAH
- 171
- 2
- 11