Questions tagged [spfx-webparts]
Technical questions about building and using web parts based on the SharePoint Framework client-side development model.
1,255
questions
1
vote
1
answer
2k
views
ReactDom render multiple elements spfx
Let me start by saying I am working on my first webpart and learning react spfx. I am trying to render multiple elements using ReactDom.render. How do I render both the elements on the same .ts file? ...
CommunityBot
- 1
1
vote
1
answer
1k
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 ...
CommunityBot
- 1
4
votes
2
answers
2k
views
Asynchrounously load lookup column values in an SPFX/PNP-JS-CORE editform
I'm working on a spfx app to be used as a SharePoint list form. The app will be used to edit ha a LOT of lookup columns. the lookup columns are rendered as dropdowns in the react component. I am ...
CommunityBot
- 1
3
votes
2
answers
3k
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....
CommunityBot
- 1
0
votes
1
answer
21
views
FATAL ERROR: Ineffective mark-compacts near heap limit Allocation failed - JavaScript heap out of memory - SPFX Solutionn Terminal error
When I try to run gulp serve command in the terminal, it works sometimes, but sometimes it throws some error like this, which I mentioned in the image below.
And it takes more time to run, so can ...
- 493
0
votes
0
answers
20
views
The Yeoman Generator encounters a failure with the error message "Trying to copy from a source that does not exist."
I am trying to generate SharePoint Framework (SPFx) client-side web parts using the Yeoman SharePoint Generator, but it consistently presents the same error as detailed below.
C:\Users\utkarsh>yo @...
- 359
0
votes
1
answer
4k
views
How to best implement pagination for a spfx web part displaying a list of links?
I have a web part that displays a filtered list of links based on the logged on users profile properties. Its working well, but I cannot work out the best way of adding pagination. The list is never ...
CommunityBot
- 1
0
votes
1
answer
1k
views
OAuth authentication for SPFx solutions
I am challenged by a SPFx based solution (WebPart as well as Commandbar-Extension). I have a set of APIs which are secured by OAuth. There is a dedicated authentication server, so I can't just use ...
CommunityBot
- 1
0
votes
0
answers
16
views
Using the Modern Script Editor web part in SPO, the type value of script tag is being modified to "pnp" + extra attrib. of pnpname w/string as value
Using the Modern Script Editor web part in an instance of SharePoint Modern Online, when adding third-party embed codes that contain script tags, the type value of script tag is being modified to &...
0
votes
0
answers
20
views
Connect pnp ListView to Sharepoint File and Media WebPart
I got a spfx webpart has a ListView of Files i get with a search in Sharepoint.
Now i want that when i select a item in this listview it will Do the Preview of the file in a file and media component ...
- 1
4
votes
1
answer
1k
views
Using ADAL with SharePoint Framework
I've setup a web part with SharePoint framework that requires access to the Microsoft Graph for displaying the recently used files.
I've followed the instruction here: https://github.com/SharePoint/...
CommunityBot
- 1
0
votes
1
answer
1k
views
SPFx TextField component setState
New to SPFx and React.
I'm trying the set the state of a TextField when I enter data into the react component and eventually use a button to drop it into a list. This is bringing information into the ...
CommunityBot
- 1
5
votes
1
answer
4k
views
"Either Guest user or Cortex is not enabled!" on SP page
I get this error: "Either Guest user or Cortex is not enabled!" in the browser's developer console when I run my published webpart. It first appeared around October 26th 2022.
The error ...
CommunityBot
- 1
0
votes
2
answers
2k
views
SPFx webpart with Bing Maps
I have SharePoint 2019, and I am trying to create a webpart that will display Bing Map, I tried this on a react app created using create-react-app, and it works fine. Then I took the code, and added ...
CommunityBot
- 1
5
votes
2
answers
34k
views
SharePoint Online full-width page
I am still exploring SharePoint Online creating webparts and deploying through visual studio code using Typescript.
I created a HelloWorld webpart and uploaded it on page. I was able to create ...
- 42.7k
1
vote
2
answers
2k
views
Cascading dropdown list in SPFx web part
Can someone help me with this issue as I would like to create cascading dropdown lists inside the web part itself and not in the property pane.
I have found this code in [github react-...
CommunityBot
- 1
0
votes
2
answers
39
views
SharePoint online Image item URL does not get url in target Release for Everyone
I have tried to get image URL using rest Api and PnP js in my SPFx react solution but not get proper image URL from Api response.
Below is the code and response from the Api. Missing serverRelativeUrl ...
- 42.7k
0
votes
0
answers
348
views
Error while using the Slider from React-Slick in SPFX webpart
I am trying to use react slick Slider in my SPFx web part as below.
import React from "react";
import Slider from "react-slick";
export default function SimpleSlider() {
var ...
0
votes
1
answer
1k
views
WebParts keep loading untill I scroll down the page or perform a zoom
environment:SharePoint online;Sharepoint Framework;
Programming languages:TypeScript
During page loading, sharepoint custom web part keeps on loading
Nothing does change untill I scroll down the ...
CommunityBot
- 1
0
votes
1
answer
1k
views
Uncaught TypeError: Cannot read properties of undefined (reading 'context') in spfx
When I am checking my published document that time I am facing this problem, before this it was running fine.
CommunityBot
- 1
0
votes
0
answers
13
views
Is there a way to create subsite based on another one, copying lists and workflows for them,..?
In Sharepoint Online, I'm trying to create a button that will trigger creating subsite and have all the lists and workflows based on one main list in root site.
E.g. there is two lists in root that ...
- 123
4
votes
2
answers
2k
views
SPFX and react-router
I'm having trouble getting react-router working on my SharePoint Web Part with React and TypeScript. I have tried react-router as a standalone webapp and it works fine. Just can't get it working on ...
CommunityBot
- 1
6
votes
2
answers
2k
views
Remove spfx webpart
I've uploaded and deployed some spfx webparts through my App Catalog site.
Now these webparts are not useful anymore so I've deleted them from the App Catalog.
Then I've checked my sites and ...
CommunityBot
- 1
0
votes
0
answers
27
views
I want create item with attachment in SharePoint online with SPHttpClient context?
Below code is attaching file but not all files, means some time 2 file some time 3 file, some time one file but not attaching all file at all in loop.
private btnclick_BtnSubmit = (): void => {
...
- 42.7k
0
votes
2
answers
456
views
SPFX WebPart - Passing variable to Property Pane
I'm in the process of creating a WebPart that has similar functionality as the QuickLinks WebPart.
like QuickLinks, I have got the properties pane to display fields depending on whether the webpart ...
- 1
0
votes
0
answers
23
views
SharePoint SPFx App uploaded in App Catalog but not appearing in "app store" page
I have created a SharePoint SPFx web part called "No Framework", and uploaded it to the app catalog but it is not appearing in the app store. Please advise what the issue is.
SPFx Package ...
- 11
1
vote
1
answer
2k
views
Taxonomy Field Values/Filtering with SPFx
I'm looking for some examples or guidance for working with taxonomy fields in SharePoint Framework.
What I need to do is have a field that is tied to a TermSet. Based on the user's input into this ...
CommunityBot
- 1
0
votes
0
answers
25
views
Using environment variables for deploy the SPFx webpart solution into the different environments
I have SPFx webpart for uploading documents into SharePoint. I would deploy that webpart into the SharePoint site collection.
I have 3 different site collections for 3 different environments: dev, ...
4
votes
1
answer
2k
views
How can I force SPFX webpart to not show cached data in SharePoint online
I have created a SPFx webpart which reads parameters from page URL query strings and renders data accordingly.
After the page is loaded and I press back button and again access the page with ...
CommunityBot
- 1
1
vote
1
answer
890
views
Sharepoint Online every SPFx web parts get this error : Something went wrong -> Mismatched anonymous define() module
I have SharePoint online sites and some spfx web parts. These sites are created with publishing site templates and web parts have been working for months. I rarely got this error "something went ...
- 1
3
votes
3
answers
2k
views
Is it possible to open modern item edit form panel from custom SPFx webpart?
Is it possible to open EditForm panel from my SPFx webpart? Something like in list view, if an item is selected, side panel appears with read-only properties and a button "edit all" enables user to ...
CommunityBot
- 1
1
vote
1
answer
265
views
How to change SharePoint Site language programmatically using spfx extension
it there way to change language dropdown of SharePoint site such as English to German using spfx solution ?
I am looking function like
pagecontext.setLanguage(1031);
0
votes
1
answer
4k
views
Uploading Attachment and items in Sharepoint Library in SPFX
Here is the function to upload attachments and items in the SharePoint library through React-js in SPFX.
Used PnP JS library for attachments uploading and items insertion in the SharePoint library.
I ...
- 1
0
votes
2
answers
2k
views
Unable to run my webpart using gulp serve
I'm trying to work on a project of a SPFx web part. The project was built normally but when I try to test my web part on my tenant the following error occurs:
"Your web part will not appear in ...
CommunityBot
- 1
0
votes
1
answer
34
views
Run SPFX webpart on Sitepage without deploying it
I have developed an SPFX webpart which overrides the existing classes on SitePage.
I need to run the webpart on sitepage without actually deploying it.
When i gulp serve it open local workbench and my ...
- 12.6k
0
votes
0
answers
107
views
Got this while saving .tsx: ERROR in Cannot read properties of undefined (reading 'getFirstToken')
Tooling
browser chrome version 117.0.5938.92 (Official Build) (32-bit)
SPFx version 1.18
Node.js version 18.18
spfx-fast-serve-helpers: 1.18.1
npm run serve works
gulp serve works
Problem arise when I ...
- 101
0
votes
1
answer
36
views
SharePoint Look and feel or navigation
We are on SharePoint Online and I am wondering if there is a way to achieve our page like this site https://fmx.cpa.texas.gov/fmx/travel/textravel/meallodg/index.php with the left navigation and ...
- 42.7k
0
votes
1
answer
2k
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.
1
vote
1
answer
1k
views
How to retrieve image from a SharePoint Online Document Library using SPFx using filters
public render(): React.ReactElement<IFlowDiagramProps> {
// const docRelativeUrl :string = event.selectedRows[0].getValueByName('FileRef');
var str="";
var usemaps="";...
CommunityBot
- 1
0
votes
0
answers
31
views
Querying, analyzing, and displaying data from external API in SharePoint
I am a new SharePoint developer and I am tasked with displaying trends in data from Zendesk in SharePoint. I have been reading the Microsoft documentations and from what I have been reading the ...
- 42.7k
0
votes
1
answer
2k
views
SPFx app not showing up in the webpart list
As I am new to SharePoint Framework, I am trying to update an existing web-part (updated the version in package-solution.json).
Updated .sppkg file in app catalog (overwrite), shows new version number....
CommunityBot
- 1
0
votes
1
answer
2k
views
CSS classes added in project.module.scss not showingUp in my .tsx file in SPFx Project
Currently I started working on React SPFx webparts and wanted to add some new CSS.
I added some styling to classes in Project.Module.scss. But Now when I am adding this class names in render() method ...
CommunityBot
- 1
0
votes
1
answer
2k
views
SPHttpClient undefined error: Using React JS to add item in SharePoint list
I'm trying to add an item in SharePoint Online list using SPFx solution where I'm using React JS to perform the action.
Below is the copied code, when debugging it says that:
"VM242:1 Uncaught ...
CommunityBot
- 1
0
votes
2
answers
1k
views
SPFX MSGraphClient - Cannot read property 'id' of undefined
I am getting this issue when calling Shared and Recent OneDrive files using MS Graph Client on my modern webpart.
Uncaught (in promise) TypeError: Cannot read property 'id' of undefined
I get the ...
CommunityBot
- 1
0
votes
0
answers
13
views
Set data from fetching by list in peoplepicker component
import {
PeoplePicker,
PrincipalType,
} from "@pnp/spfx-controls-react/lib/PeoplePicker";
import * as React from "react";
//People Picker Component
const ...
- 24.5k
0
votes
1
answer
1k
views
react-search: The type definition `index.d.ts` does not exist. Create one and try again
I am new to SharePoint and I'm trying to deploy a modern Search Web Part following the instructions here sp-dev-fx-webparts/samples/react-search/
When I run tsd install on the command prompt, it ...
CommunityBot
- 1
1
vote
1
answer
1k
views
How to use people picker control using sp-pnp-js( Pnp-JS-Core) library and save users selection in Person or Group type column in Sharepoint List?
As I am new to Sharepoint framework, I wan to know how can I use the people picker control using sp-pnp-js library and save the users selection in Person or Group type column in Sharepoint List....
I ...
CommunityBot
- 1
0
votes
1
answer
2k
views
Retrieve item ID after adding to SharePoint list using PNPJs
I'm building a SharePoint SPFx react app. In a nutshell, the user fills out a form that I created. When the user hits submit, using PNPJs: https://pnp.github.io/pnpjs/sp/items/ I'm adding the item to ...
CommunityBot
- 1
0
votes
0
answers
26
views
getting error in recursive function
I use SPFX React, I am getting data from SharePoint Library which is more than 50000. So I want to make a function for getting data in data table library on behalf of page size and page number.
For ...
- 42.7k
0
votes
1
answer
38
views
Is app with SPFx version 1.4.1 compatible with SharePoint Online?
Is app with SPFx version 1.4.1 compatible with SharePoint Online?
I deployed SPFx app of version 1.4.1 and it has problem to sometimes load the web part and sometimes not, is it because of version ...
- 42.7k