Questions tagged [spfx-webparts]

Technical questions about building and using web parts based on the SharePoint Framework client-side development model.

Filter by
Sorted by
Tagged with
1 vote
1 answer
97 views

SPFx You may need an appropriate loader to handle this file type

I am trying to utilize MUI-X charts in my SPFx web part. The code does not show any errors. But when building or using gulp serve, it gives the below error: ./node_modules/@react-spring/core/dist/...
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? ...
0 votes
0 answers
16 views

Does SPFx colors affect the SharePoint Site theme

I have SPFx extensions and webparts deployed in the sites and both framework uses the custom color built in the .sppkg package. And I have custom site theme installed using PowerShell. Does the SPFx ...
1 vote
1 answer
2k 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 ...
0 votes
0 answers
11 views

SPFX customFormatter

Is it possible to take the JSON of a customFormatter from a field info object and apply it when rendering a component? I would like to render choice fields as they are displayed in a list view. For ...
1 vote
2 answers
722 views

SPFx Retrieve lists using SharePoint REST API

I am trying to create a web part to deploy to SharePoint Online. Following this Connect your web part to SharePoint. When I add the code below. I receive the errors below. Do you have to have Office ...
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 ...
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 ...
0 votes
0 answers
6 views

SharePoint workbench only works for some users

What exact permissions are required to use the workbench? (http://{tenant}.sharepoint.com/_layouts/15/workbench.aspx) I'm trying to test an SPFx app which involves multiple users. I created some dummy ...
0 votes
1 answer
2k 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 ...
5 votes
3 answers
36k 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 ...
0 votes
0 answers
21 views

How to get the data from SharePoint library above 5000 items with pagination in SPFx?

How to get the data from SharePoint library above 5000 items with pagination in SPFx? Current code I am using: const [PublishDocument, setPublishDocument] = useState([]); const PublishedDocument = ...
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 ...
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 ...
0 votes
1 answer
2k 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 ...
0 votes
0 answers
5 views

Is it possible to run multiple SPFx local workbenches for multiple user accounts in a single Azure VM?

Is it possible to serve multiple local workbenches for a single solution in one VM with multiple user accounts? We are working on an SPFx development solution using SharePoint 2019, using one VM with ...
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-...
0 votes
0 answers
19 views

How do I make a SharePoint Web Part work when installed on a SharePoint instance that uses a vanity URL?

My team has developed a SharePoint integration that uses the SharePoint Web Part framework to embed a page from our application on a SharePoint page. This is working well for most of our customers, ...
0 votes
0 answers
23 views

Can an SPFx custom webpart close an instance of itself?

I am working on a custom SPFx webpart. I wanted to know if there is a way to make the webpart close and/or re-open itself. Ideally this would trigger when the user fills out the text fields in my ...
0 votes
0 answers
8 views

Pnp Rich Text Editor resizes automatically. How did I stop it from doing this?

I am using the pnp rich text editor. The textbox resizes itself automatically to accommodate the amount of characters in the text box. If there are too many characters, the textbox grows in size. How ...
0 votes
0 answers
14 views

Can we move code from ts file to tsx file in the react SPFx, will it work?

In react SPFx, property pane fields and interface was there in the .ts file while creating react SPFx project. I want to use it in .tsx file. Will it work or not? Because in every web part, .ts file ...
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.
0 votes
0 answers
14 views

Page numbers are not rendering in Pagination control spfxwebpart react

I am using Fluent UI pagination control. Setting page count dynamically using state variable. But, it is not setting in the initial page load once webpart loaded. Showing only "Next" and &...
2 votes
1 answer
65 views

While setting up a SPFx solution, getting node:path error

Node version - 12.22.12 Npm version - 6.14.16 SPFx version - 1.12.1 @microsoft/[email protected] After npm i, when running Gulp build, its giving error as: Error: Cannot find module 'node:...
0 votes
1 answer
17 views

TypeError: Cannot read properties of undefined (reading 'post') Posting to Azure web API from SPFX

I hope someone can help me with this. I’m getting error message TypeError: Cannot read properties of undefined (reading 'post'). The Azure function is working fine and is used in other projects.
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 ...
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 ...
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 ...
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 ...
0 votes
0 answers
20 views

Cannot Install React-Birthday Sample Webpart

I'm trying to install React-Birthday webpart from Github repository sample webparts but facing issue when running npm i. Things I've tried: I tried to remove node_modules, clear cache, install npm ...
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 ...
0 votes
0 answers
28 views

I am creating an SPFx web part which shows a diagram from another third party website. I am using the embedded code inside web part

I am creating an SPFx web part which shows a diagram from another third party website. I am using the embedded code inside web part. the script I am using is: <h3 class="website-title">...
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 ...
0 votes
0 answers
21 views

Hightlighted Content webpart - filter based on columns and display content from another site collection

I'm working on an intranet build.We have decided to have a dedicated publishing site for News.I would like to display these news content on other sites. The news webpart is great to do this but the ...
0 votes
1 answer
25 views

Remove/disable toolbar options from Text web part - SharePoint Online

I'm working on an intranet project and one of the requirement is to be able to restrict users so that they can use only a specific font size e.g it could be Normal text but just font sizes between 10 ...
0 votes
2 answers
56 views

Adding a dropdown to an SPFx custom webpart

I am new to building custom webparts. How do I add a simple dropdown list to a custom webpart. I am using the react framework and the myWebPart.ts file to do the majority of my work. Thanks
0 votes
0 answers
19 views

I need a four column image web part

Using SharePoint online, I have created a SharePoint page structure, to include a 4th side column and this leaves me with maximum page column split of 3 on the remainder. I am trying to add 4 image ...
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="";...
0 votes
0 answers
21 views

How to generate Azure app token using client id and client secret using SPFx with react.js (webpart)?

I am trying to generate the azure app token using client id and client secret. Please find my below code: const formData = new FormData(); formData.append("grant_type ", "...
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....
0 votes
1 answer
1k views

Multiline text field JSON to array - SharePoint SPFx

I'm building a webpart application using SharePoint SPFx with react. I would like to use SharePoint's multiline text field as a way to store an array. I saw this thread here which said you can convert ...
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 ...
5 votes
3 answers
11k views

NodeJS not compatible

when I run gulp serve I get the following error. Your dev environment is running NodeJS version v10.15.0 which does not meet the requirements for running this tool. This tool requires a version of ...
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 ...
0 votes
1 answer
81 views

How to get List webpart in full-width column?

I want to use Sharepoint Online default webpart called List, to load the default list view on the page. I want to load it in full-width section but so far I didn't find a way. Is it possible/and how ...
0 votes
2 answers
2k views

Spfx webpart to fetch list data from different site collection

I need to create a spfx webpart which fetch data from a list avaialble on different site collectionn. Ex: SPFx webpart deployed at https://test.sharepoint.com/sites/test1 List from where data need to ...
0 votes
2 answers
2k views

Display Rich Text in SharePoint Online

I am trying to display the rich text in a list item . I tried using the JSON formating, but it does not seem to have any support for "Enhanced rich text". The txtcontent converts the rich text to ...
0 votes
1 answer
3k 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 ...
0 votes
1 answer
85 views

How to upload an image and other list items to a SharePoint list using SPFx web part?

I have a SharePoint list called complex form, which has the following columns Title, FirstName, LastName, About, Country, State, Street, City, Zip, Email, Company, Photo, the photo is an image column ...
0 votes
1 answer
41 views

Unable search and filter items based on Chinese & Japanese languages

I have a SharePoint list that contains fields as translations for the Title field in different languages. Some of them are Chinese Simplified, Chinese Traditional and Japanese. When I try to query the ...

1
2 3 4 5
26