Questions tagged [reactjs]
The reactjs tag has no usage guidance.
83
questions
0
votes
1
answer
8
views
Jquery .load() not working properly
I am building a react spfx solution that looks like a website. It has a nav bar. The navbar is actually links to the site pages in the same site. What I need is load the contents from "...
0
votes
0
answers
23
views
SPFx React Error on Rendering Loop and PnP controls
I am using React to develop with SPfx for SharePoint online and am trying to rebuild a past solution I made, so that I can utilize the property pane of sharepoint to edit the webpart. I am getting an ...
2
votes
1
answer
81
views
Ternary operator in SPFx to show hide
I am Working on SPFx and writing below code to get current user belong to particular group or not and if its belong then show else hide
below is my interface:
UserInGroup:boolean;
State:
UserInGroup:...
1
vote
0
answers
31
views
Provide user ID and password to sp-rest-proxy react app dynamically and run the proxy with the credentials [closed]
I finally found the way to connect to SharePoint 2013 on-prem environment from an external react app. I made use of the sp-rest-proxy (https://github.com/koltyakov/sp-rest-proxy).
While deploying the ...
0
votes
0
answers
58
views
Problem with HTML events onDragOver and onDrop in SPFx using React
I am playing around with SPFx and want to build a drag and drop app in SPFx using React but I am facing the problem where neither of these actions are firing when I try to drag over a file over the ...
0
votes
0
answers
13
views
Having null result whenever using dom selectors in spfx webpart
Trying to get the tsx video tag duration by selecting the tsx tag through dom selectors but getting null in the console
0
votes
1
answer
102
views
Sort items inside my React.Js SPFx web part
I have a SharePoint list, and i want to order the items based on the "Featured" field, but things is not working, where if i define this ordering logic:-
a.map(b => {
if (b ===...
1
vote
0
answers
25
views
How I can force a table <TD> to occupy the full vertical space? [closed]
I want to show 3 boxes of content inside a table inside my SPFx react web part:-
I have the following code:-
singlenews.tsx:-
import * as React from 'react';
import styles from './SingleNews.module....
0
votes
0
answers
18
views
How i can get the Web Part properties from a sharePoint list intead of getting them from the Web Part's PropertyPaneConfiguration
I have built a Web Part which have the following:-
Inside the Web Part settings page >> there are 2 fields named as "Who We Are" & "Our Value" which allow the user to ...
1
vote
1
answer
78
views
Rest apis in SharePoint
I am new to SharePoint but not having any luck. Please correct me if I am wrong on the process so far.
I am using react and need to create a CRUD app in react for SharePoint, so to do this I need to ...
0
votes
1
answer
282
views
Check null value in spfx webpart
I am trying below code which will pull data using rest and bind in table but i want to display message if contact column data is blank in any items tryin below but not working
{this.state.items.map((...
0
votes
1
answer
600
views
Get selected value of fabric dropdown
I want to get value of selected dropdown in my Visacontact() function, below is my code:
<Fabric className={styles.matrix2}>
<VirtualizedComboBox
styles={comboBoxStyles}
...
0
votes
1
answer
253
views
Need guidance to create React SPFx webpart with nested dynamic content
I am working on a scenario where we have a top level SP online site 'Top1' and it has subsites for each department say dept1,dept2,dept3.Each department has specific request list and and respective ...
0
votes
1
answer
468
views
VideoPlayer using React and Typescript
Being new to typescript , I have been struggling with its implementation lately using it on the webpart.tsx file
With the help of the posts here , was able to get to the point where the video plays ...
1
vote
1
answer
74
views
how can we automatically add commas to numbers being typed in SPFx react fluent textfield. ex: 1,000,000,000
<div>
<TextField
value={this.state.Budget}
onChanged={this.onChangeBudget}
/>
</div>
public onChangeBudget = (value: string) => {
console.log("Budget : ...
2
votes
0
answers
54
views
Get Detailed SP List Item Version History
I am using ReactJS to develop a custom form and my list includes a multiple lines of text field with the AppendOnly flag set to true. When I open the form, I want to retrieve the version history for ...
0
votes
0
answers
125
views
pass data from component to Teaching Bubble headlines
I am trying to pass data for headline from my .tsx file to teaching bubble headline which is another but getting below error
import * as React from 'react';
import { ...
0
votes
1
answer
325
views
PnP People picker - how to clear/reset/filter values in onchange event?
I could fetch the users in on change event that is 'selectedItems={this.getPickerItems}'.
But how would I reset or filter values in the control based on some condition?
I tried to assign [] to items ...
1
vote
0
answers
20
views
SiteBreadCrumbs- How to avoid Site Pages
I'm making use of the github code to display breadcrumbs in my site. The code uses pnp control to render the content. Is there a way we can modify this to avoid Site Pages appearing in the breadcrumb.
...
0
votes
1
answer
126
views
Not able to fetch data from particular list item of site content using React APP WEB-part
I am able to fetch the list which we see on the landing screen of the site-content. However, when I am trying to fetch data by finding a particular item by its title I get an error CANNOT FIND LIST '...
0
votes
1
answer
57
views
Reading configuration at runtime
I have created "Search Result Source" in my development & production environment Using that in search REST API with source GUID. Now thing is that source GUID of development & ...
0
votes
1
answer
613
views
Current Login user profile image in reactjs
I am trying to fetch profile for current login user in SharePoint 2019. But if there is no profile image then it will throw error in img tag. So I created small component that if profile image is not ...
0
votes
1
answer
203
views
SPFX react solution intrinsic error
child component
export default class Example extends React.Component<ICState,{sData,cData}> {
constructor(props,state:ICState) {
super(props);
sp.setup({
context: ...
0
votes
1
answer
147
views
cross site collection file property update in SPFx
is there a way to update SharePoint Library file properties from different site collection? I have file uploaded to https://sharepoint.com/sites/site1 & I need to update the file property from ...
0
votes
1
answer
700
views
Upload file from one site collection to another in SPFx
I have a SPFx solution which have a input tag to upload a file. When I try to upload the file in the same context of the site collection it works fine, but I am not able to get uploaded to different ...
1
vote
0
answers
134
views
When i am trying to get data formatted data from list(rich text) and bind it to pnp Rich text box cntrol nothing is visible [closed]
When i am trying to get data formatted data from list(rich text) and bind it to pnp Rich text box cntrol nothing is visible in control, though the data is there in state.
I have tried to use below ...
0
votes
1
answer
1k
views
How to check folder permissions using pnp/sp library in spfx web part?
I am developing one SPFx web part wherein I am showing all the folders which the logged-in user has access to. And I have a couple of folders in one document library(IT Docs) and some of the folders ...
2
votes
0
answers
609
views
Sticky Header in SPFx webpart
I have a SPFx webpart where I am using "DetailsList" to bind search data, I want to make header sticky while person scrolls the webpart, I have a search bar then dropdown and then grid in ...
0
votes
1
answer
2k
views
How to retrieve user and groups from sharepoint online using SPFX Webpart
I have to retrieve all users and groups from sharepoint online site,it should be displayed in spfx webpart in below format.Provide me any code examples in React JS.
UserName GroupName
user1 ...
0
votes
1
answer
259
views
Is SPFx client web part durable? Is this good approach to develop web pages to publish in SharePoint online (Office 365)?
I have some dynamic pages in my intranet website (CRUD operation plus search/filter). I have office 365 SharePoint online version. I want to develop client web part using reactjs and restAPI to work ...
1
vote
2
answers
881
views
Redirect to another component in spfx webpart recatjs class component
I have developed an component which displays the table of data and an button which should leads to the another component to create an new item in the list.
I tried different approaches to get this ...
0
votes
1
answer
590
views
React.js: avoid delay on element <input type=“file”> onChange event
Any react-specific solution to the problem, described here?
https://stackoverflow.com/questions/46072489/how-to-avoid-delay-on-element-input-type-file-onchange-event?noredirect=1&lq=1
Basically ...
1
vote
1
answer
198
views
Display multiple Dynamic IPropertyPanePage.groups Sharepoint Online Framework
Hi everyone I'm creating a Web Part in order to display a full width Bootstrap grid with you can personalize Sharepoint pages. Selecting the Grid Size options the Grid is created and everything works ...
1
vote
1
answer
90
views
In SharePoint Framework Extension (Application Customizer), are there any other placeholders that can be used aside from the header and footer?
We are trying to add a drop-down control in the command bar of a page or beside the share button on a SharePoint Online site.
May we know if there is a specific placeholder we can use to achieve this?...
0
votes
0
answers
276
views
External script added to my react SPFx WebPart is not working in IE 11
I want you to help me with the IE11 issue. Thing is my SPFx web part was not working on the IE browser, I tried various Polyfills and some core-js modules but none of them worked. Later on, I found ...
0
votes
1
answer
959
views
how to read all the properties of all the files in a Document Set Using @pnp spfx
how to read all the properties of all the files in a Document Set Using @pnp spfx React JS ?
0
votes
1
answer
922
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 ...
1
vote
1
answer
973
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
0
answers
36
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:
...
2
votes
2
answers
681
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
1
answer
183
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
1
answer
630
views
Accordion in SPFX using SharePoint list [closed]
How to create an accordion SPFX webpart using SharePoint list as backend?
0
votes
3
answers
2k
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
1
answer
161
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
1
answer
520
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
1
answer
293
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
1
answer
637
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
1
answer
1k
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
1
answer
273
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
1
answer
436
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(
...