Questions tagged [reactjs]

The tag has no usage guidance.

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

Grouping and displaying values in ReactJs [closed]

I have grouped object inside an array according to specific property (in my case Type.title). let grouped = _.mapValues( _.groupBy(this.state.types, "type.Title"), x => x.map(y => _.omit(y, "...
0
votes
1answer
28 views

Get Enriched MultiLineText Field value without loosing its HTML property and Display it without html tag using spfx pnp/sp

I need to get enriched multi line text field value of a list item in SharePoint online SPFX web-part and display the field value in a table column without loosing its html property also hiding html ...
0
votes
1answer
34 views

Open image in new tab in spfx webpart

I want to open image in new tab if some one click on legend "Click here". <p className="legends"><FieldUrlRenderer text={'Click here'} url={imageList.Image ? imageList.Image["Url"] :''} ...
1
vote
0answers
22 views

How to implement ComponentDidCatch in SPFx

Could someone please show me how to implement ComponentDidCatch in SPFx. I did it successfully in ReactJs like this: Throwing an Error : throw new Error('I crashed!'); and it would get caught here: ...
1
vote
2answers
64 views

Is possible put React JS on Sharepoint Extension?

I am new to SharePoint development, and in need to create a custom side panel (with React), when click on item of list view. Is it possible to use React JS while developing SPFx extension?
0
votes
1answer
69 views

SPFx webpart component set default color

I have created a tiles webpart where i am changing the color on toggle between tiles but i want to set default color for one of tiles once page load and then user can toggle ...
0
votes
1answer
42 views

Accordion in SPFX using SharePoint list [closed]

How to create an accordion SPFX webpart using SharePoint list as backend?
0
votes
3answers
75 views

Add Css in spfx

I want to add below CSS in SPFx web-part using states. But unable to do it: div[class^='pageTitle_'] { display: none; }
1
vote
1answer
79 views

Title Area modern ui pages does not load

I have two modern UI pages Test1 and Test2. In Test1 page, I am using SPFx webpart to hide control on particular pages. I am using CSS: global { div[class^='pageTitle_'] { display:none; ...
0
votes
1answer
88 views

PNP JS Taxonomy Term retrieval not giving me back all terms in SharePoint online

I'm currently developing a WebPart for a client using SPFX, React JS and PNP JS where I need to get a full list of Countries from a Countries taxonomy at Tenant level to allow my to populate a ...
0
votes
1answer
89 views

Image Carousel Video Autoplay true or False

I want to set autoplay true if it is video and false if it is image. I tried using setState inside autoplay as given below but it is throwing an error: autoPlay={this.setState({ autoplayvideo: true ...
0
votes
1answer
83 views

Image Carousel SPFx webpart with video as a source

I want to bind a video in carousel with source which is a hyperlink in the carousel. I am able to bind images but not able to bind video as a source. How do I load videos with images? <div style={...
0
votes
1answer
205 views

How to retrieve Image column from SharePoint list using React js SPFx

I am trying below TypeScript to retrieve the Image column using SPFx .Unfortunately image is not rendering on page. Please help me on this.
0
votes
1answer
109 views

on click change Document card color SPFX

I have developed a webpart where on hover i am changing the color of document card office fabric component and on click of document card i am showing grid ,but i am not able to change color of ...
0
votes
1answer
43 views

Argument of type '{ description: string; siteurl: string; }' is not assignable to parameter of type

For SPFx running gulp serve getting below error. For this line it was working before: public render(): void { const element: React.ReactElement<IReactGetitemsProps > = React.createElement( ...
0
votes
0answers
44 views

SPFx: Unwanted border on click of Document Card in React JS

I am creating SPFx webpart using React JS. On click in document card component I am getting unwanted border. I tried removing it but not working. I have applied border-radius on document card style, ...
0
votes
1answer
97 views

Document card hover colour change

Hi I have used office fabric ui document card i want to change colour on hover of document card , const cardStyles: IDocumentCardStyles = { root: [ ...
0
votes
1answer
68 views

SPFX: is @pnp/sp get call asynchronous?

I am new with @pnp/sp and I am having problems with my code: public render(): React.ReactElement<IVisualizadorPermisosProps> { var arbol=[]; sp.web.get().then((data)=>{ arbol....
1
vote
1answer
311 views

SHAREPOINT FRAMEWORK - REACT JS alert on Page Load

I am new to SharePoint framework and React JS. I have build a basic Web Part with CRUD operation using React JS. I wanted to show drop-down(html select) value on Page Load in an alert. I am able to ...
1
vote
0answers
177 views

Office ui fabric Dropdown menu does not work on keyboard press

I have SPFX component with React library. The Dropdown menu is working fine with mouse onclick events. however, on pressing enter or space is not working. I am thinking of using eventhandlers such as "...
0
votes
1answer
774 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 ...
1
vote
1answer
523 views

Workbench issues with spfx 18.2 and react 16.8.4

I have recently updated a number of modern spfx webparts to spfx 18.2 and this morning when I try to debug in workbench (locally and on tenant) I am getting serve errors in relation to react and react-...
3
votes
2answers
467 views

Integrating Azure custom BOT on SharePoint home page

I am planning to create a custom UI Bot using ReactJS and have it on the Home page(NOT modern) of our SharePoint site. After some research, i found out we can use it with SPFX webpart and possibly ...
0
votes
1answer
46 views

Call child component method in parent and visa versa

how can I call a parent components methods from child or visa versa. I'm using reactjs and typescript in spfx webpart. Or should I use helper classes to call methods of another classes from anywhere?...
0
votes
0answers
304 views

SPFX PeoplePicker value and retaining initial selection

Looking to see what is going on here, I've recently started using React JS in Modern SPFX Web Part development and have come across a bit of an issue with the @pnp js SP React Control for ...
0
votes
2answers
80 views

Mulitiline of text column not used to filter particular word from list using rest API filter query in sharepoint online

I want to search the value in one particular column of the list using RestAPI. _api/web/lists/getbytitle('FAQ')/items?$filter=contains('" + Searchtext + "',Answers) And tried this, _api/web/lists/...
1
vote
1answer
782 views

Problem with rendering a React component in another component for SPFX

This is my first post here, I guess :) I am writing because I have a task to make a Shopping app which should be made in SharePoint Framework and use React as a framework. My current problem is ...
2
votes
1answer
497 views

Best JS framework(Angular/React/Vue) to use in SharePoint 2013 [closed]

We have tools (Basically CRUD operations in multiple lists across sites/site collections. Handles large amount of data and has lots of business functionalities/logic) that were built using jQuery and ...
1
vote
2answers
959 views

SPFX webpart context is undefined

Ok so i've searched for a while and tried everything. I've followed these steps as well -> How to retrieve pageContext in SPFx? So far its just a "testing phase", but i get stuck at the beginning ...
1
vote
0answers
530 views

People Picker React js

Ok I got two questions, might be related. 1.) How can I use the following library in React using import <script type="text/javascript" src="_layouts/15/clienttemplates.js"></script> <...
0
votes
1answer
42 views

Spfx webpart - single web part with 100+ forms in it

I am creating a spfx-ReactJS web part for O365 site. This is actually a java to sp re-engineering. Legacy java app has 100+ pages, I am trying to put all of these into one spfx webpart and add it to a ...
2
votes
1answer
27 views

Feasibility of introducing React to a locked-down SharePoint environment [closed]

The job I work at has a locked-down SharePoint 2013 environment (no CDNs, no external pages, etc...) Most work is done with SharePoint Designer or the SP UI, with Visual Studio and JavaScript as a ...
2
votes
0answers
130 views

Dynamic update Icon in SPFX client Web Part

I am using office ui frabric details list to display documents on spfx client web part from here. Now, I want to implement check-in/check-out icons to be displayed on spfx client web part dynamically ...
0
votes
3answers
566 views

Reactjs, TypeScript & Webpack on SharePoint2013

I know that Reactjs, TypeScript & Webpack can be used on SharePoint Online to create web-parts. But can it be possible to create web-parts for SharePoint 2013 on premise. Please let me know if it ...
4
votes
2answers
112 views

SPFx- Routes vs toggling visiblity

I have a requirement in which I have to hide the component from the page and load a new component. Which one is the preferred approach: Toggling the visibility of component Using routes
1
vote
0answers
212 views

Not able to print HTML based on If statement

So I'm trying to print some HTML code depending on the IF statement. but I'm getting "undefined[object Object][object Object][object Object]" public render(): React.ReactElement<ISPWebPartProps&...
3
votes
2answers
1k views

Office UI Fabric DetailsList(React) rendering: DetailsColumn.render() error

I am trying to add a very basic implementation of the Office UI Fabric's DetailsList React component to my project, but keep on getting the following error when trying to render it: 'DetailsColumn....
0
votes
0answers
238 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 '~@...
1
vote
1answer
323 views

How to sort a sharepoint list according to average rating column in react js?

I have a list which is to be sorted accoring to the average rating column and the top 3 items is to be displayed in react js. This is the api endpoint used : ${this.props.siteurl}/_api/web/lists/...
1
vote
1answer
222 views

Reuse Child Component Method to Parent Component Fabric React - SPFx

I am using Fabric React with SPFx. I want to use one component public method to another component. How can be possible to reuse method? My Parent Component: export class PanelSmallRightExample2 ...
0
votes
1answer
144 views

SPFx image previewer extension

I am looking around to create an image previewer extension using SharePoint framework. I don't want to reinvent the wheel, so I am just wondering if there are some ready components which I can include ...
1
vote
2answers
5k views

SPFX react - click button to update web part

I am using the SharePoint framework with React. I have a button on the web part that when clicked, I want to output a string on the web part. The way I currently have it set up, you have to refresh ...
1
vote
1answer
442 views

Responsive Design in Web Parts

How can one use a grid like this https://www.npmjs.com/package/react-material-responsive-grid so it's displayed on mobile phone properly without the Desktop View on any Mobile phone browser(Safari,...
1
vote
1answer
2k views

Implement Display, Edit and New forms in spfx web part using reactjs

I have 3 buttons on spfx web part 'Display','Edit' and 'New'. When I click on these buttons, respective form should open with text boxes and data from sharepoint (online) list. I want to use Reactjs ...
0
votes
0answers
296 views

SPFx:: pnp js :: Delete selected file from client web part using Reactjs

I have a SPFx client web part with documents from library. Now when I select item/row, I need to perform different operations like Delete/Check-in/Check-out based on the button events. I need to ...
4
votes
4answers
606 views

How to catch navigation event in SPFx webpart?

Is it possible to catch navigation event inside Sharepoint Framework web part? I know this is possible in application customizer using context.placeholderProvider.changedEvent, but I cannot find ...
2
votes
0answers
60 views

Is it possible to create a SharePoint hosted list by SPFx?

I need to create a list inside the app which I can remove it when I delete the app from the site.
0
votes
1answer
505 views

Delve profile from SharePoint from list?

I have a SharePoint List from List API and trying to pull in some info about user from Delve. All the steps needed before my output is fine which includes things like fetch, looping, array objects etc....
1
vote
1answer
2k views

office-ui-fabric-react upload file compoment and country-region-selector abscent

how can get the "upload file" and "country-region-selector" compoments in office-ui-fabric-react. it seems that office Ui fabric doesnot have those compoments. on React there is only this https://npm....