Questions tagged [spfx-webparts]
Technical questions about building and using web parts based on the SharePoint Framework client-side development model.
892
questions
0
votes
1answer
14 views
SPFX - React - list / listItem/ page is undefined in this.context.pageContext
I am creating SPFX web part with React.
In which I am trying to get the current page ID on which webpart is added. I was trying to check if I can get it directly from the page context.
I am getting ...
1
vote
0answers
14 views
What's the pros/cons of updating vs not updating version number on SPFx webparts or customizations?
In SPFx development, what is the benefits or disadvantages of updating or not updating the version number when updating in the app catalogue?
The best practice appears to be to update it to something ...
0
votes
1answer
24 views
Take site URL from Sharepoint online WebPart?
I am trying to create a dynamic Webpart that fills its data dependant on the site URL. Basically when you add the webpart to the page it will take the URL and query the data from the database.
The ...
1
vote
0answers
18 views
How does updating SPFx webparts/extensions work between tenant wide/non-tenant wide deployment models?
I am trying to understand the difference between deploying spfx customizations between tenant wide and non tenant wide (and differences when updating/not updating the version number). Per my current ...
0
votes
1answer
28 views
Suggestions for creating an app or a web part in a Team Site
I would like to develop a user control with a text box where the user will enter his/her UserID and click the button to see some info which is populated by my own REST API.
Is there a web part out of ...
0
votes
0answers
20 views
How to detect what the site template is in SPFx?
In SPFx modern sites, how can I detect what site template it is? In a shared tenant environment, I want to be able to be able to deploy them tenant wide, but disable them on certain sites (that are ...
0
votes
1answer
17 views
How to set up SPFx customizations on a shared tenant?
I have a tenant thats shared with multiple regions from the same company. Lets say region A, B, C. Each one is doing their own customizations but its all on the same tenant. And we are following the ...
0
votes
1answer
28 views
Two Web Parts Side by Side
I am having trouble customizing my SharePoint site. I want to add multiple webparts side by side on my page but SharePoint doesn't have this option natively. You can only add them in the downward ...
0
votes
1answer
28 views
office fabric Document card css
hi i am using office fabric UI to show Document card as Tiles below is my code i want icon should come at center and text at bottom in Yellow bar
const cardStyles: IDocumentCardStyles = {
root: ...
0
votes
1answer
22 views
Getting Failed to load component from localhost URL when deploying SPFx webpart to SP Online
I am trying to deploy my spfx webpart (not for testing). I am using
gulp clean --ship
gulp build --ship
gulp bundle --ship
gulp package-solution --ship
but getting that error
<span class="...
0
votes
1answer
38 views
How to read from the Image column in sharepoint Online lists using RestAPI?
In SP Online lists (modern experience), I've added a Image formatting and constraints for publishing column to the list (via site columns), it converted my modern list into classic. Also I am not able ...
0
votes
0answers
41 views
Getting property overridden error for dataVersion() in SPFx
In spfx when I load the default reactjs template, I get this
Anyone know whats wrong?
0
votes
1answer
28 views
Default property values not working in SPFx web part
I have 3 web part properties set up in my spfx web part. However it is not showing the default values I have set
{
"$schema": "https://developer.microsoft.com/json-schemas/spfx/client-...
0
votes
1answer
33 views
anchor tag href redirects to another without clicking the icon
I have made 2 tabs , in the second tab I have a datatable in which one column holds the anchor element...
In the anchor element I have "href" attribute in which I have called another ...
0
votes
1answer
29 views
SPFx: Error in REST API call spHttpClient.get()
In my child component:
I tried to make a rest call from spfx web part to get people results, but it throws errors.
this.props.context.spHttpClient.get(query);
Error: can't read property get of ...
0
votes
1answer
34 views
How to make foreach function in jquery asynchronous?
I am trying to make each function of jquery asynchronous...In sharepoint framework, I am trying to update each line item of HTML table to sharepoint list using PnP JS Core library. For this I am ...
0
votes
1answer
25 views
Check if webPart is added as fullWidth instead Boxed
I've a webPart into React that can be added as full-width or not.
My question is:
is possible to check if this webPart was added as full-width or not?
If I check value of manifest, I can understand ...
0
votes
2answers
23 views
SPFX ClientSideAssets folder and dist folders have old code
When I build my solution, minified JS files have my old lines. Here are my steps:
1 - gulp clean
2 - gulp build
3 - gulp bundle
4 - gulp package-solution --ship
file under \dist\test-web-part.js
file ...
1
vote
3answers
52 views
Expanding People and Groups Column using React SPFx
Being new to SPFx , I've not able to retrieve values from people and group Attendee column
Below are the steps I followed
Defined Attendee in the below interface
export interface IListItem{
...
0
votes
1answer
78 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
1answer
34 views
How to Retrieve data from SharePoint list via PnP JS Core and CAML Query
As I am new to SharePoint framework, I am using PnP JS core library in SharePoint webpart,please suggest how can I retrieve list items from SharePoint list via PnP JS core and CAML Query.
Please ...
0
votes
2answers
48 views
Unable to remove left navigation from a SharePoint Page
I have a SharePoint Online page created with a template, which I cannot remove the left navigation pane from. (I can edit the list of links, but I want to remove the whole pane completely).
Ideally I ...
0
votes
1answer
36 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 ...
0
votes
0answers
21 views
function not getting called onkeypress event of the input element
I am trying to allow only numeric input in a textbox...For this I am writing a code as follows:
'<input type="text" id="txtFlexibility" class="form-control input-sm" ...
0
votes
2answers
58 views
How to filter the retrieved items using a pnp-js-core REST call to a SharePoint list
As I am new to Sharepoint framework , I am trying to filter the retrieved list items from sharepoint list.
Please find below code:
pnp.sp.web.currentUser.get().then(function(res){
var userEmail = ...
0
votes
1answer
29 views
¨PnPJS Graph : how to list all members of a Group
I am trying to get all members from O365 group using pnpjs graph. Following is the snippet:
import { graph } from "@pnp/graph";
import '@pnp/graph/groups';
const group = await graph.groups....
0
votes
0answers
25 views
SharePoint Online quick lunch expand button doesn't always work (sometimes has to be clicked twice at least to work)
Has anyone encountered the issue, when they have expandable links in their SPO quick lunch navigation (you know, with up / down arrows to expand / collapse sublevel links, that the sub-content doesn't ...
0
votes
3answers
44 views
Add document set content type to a library using Rect and SPFX SharePoint Online modern site
I am trying to add document set content type from site collection to a library, but I am failing to do that.
Please help me to solve this issue. I am trying to use React and SPFx for SharePoint Online ...
1
vote
1answer
14 views
Error “This tab is not supported on your mobile” on adding webpart to Microsoft Teams when login through mobile
I have synced the spfx webpart with Microsoft Teams, it is working fine on the system but when trying to open the tab through mobile it is giving me an error "This tab is not supported on your ...
0
votes
2answers
45 views
how to retrieve image column from sharepoint list using sp-pnp-js in SPFX webpart
I am not able retrieve image column from SharePoint list in my solution using sp-pnp-js.
0
votes
1answer
18 views
Categories during the Webpart Selection
is it possible to create categories during the webpart selection, in the modern experience, except developing them on my own? I want to create a category which is relevant to the users and simplify ...
1
vote
1answer
29 views
Error creating SPFx with React JS
Getting below error while trying to create an SPFx project with ReactJS, but if I use NO JS Framework it works fine. I have updated the npm to version 6.14.7, updated the @microsoft/SharePoint ...
1
vote
1answer
57 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 ...
2
votes
2answers
39 views
What user permissions are required for the development of webparts in Sharepoint Framework?
As I am new to SharePoint Framework, I want to know what all user permissions are required for the development of web-parts in SharePoint Framework, along with web-part deployment in Microsoft Teams ...
0
votes
1answer
30 views
crud operation using bootstrap with pnp library
I was not able perform crud operation in bootstrap form using SP PnP JS library .
Below is the code:
public render(): void {
let cssURL = "https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/...
0
votes
0answers
20 views
Bind Detailed List on selection of Dropdown SPFX
I had created a SPFX webpart which bind data in Detailed list and one more component is there which is dropdown .
I am unable to bind Detailed List on change of Dropdown , below is my full code , now ...
0
votes
0answers
15 views
getting document from Sharepoint Document library
Can anyone guide me to how to get document from Sharepoint Library using rest api in Spfx ,tried using below code to bind static data in Detailed List ,but unable to get rest api call ?
...
0
votes
0answers
41 views
SPFX : using the OOB filter on a modern Document Library webpart using dynamic data from a custom webpart on the same page (SharePoint online)
Sharepoint Online/SPFx wizards-> do you think this is even possible? More specifically, in the property pane of the document library webpart (moder/SharePoint Online) it has the option to toggle
...
0
votes
0answers
14 views
@microsoft/file-browser production release and support
We have started building a custom Azure DevOps Services Extension, for our Organizations, that is using the @microsoft/file-browser API to make MS Teams/SharePoint Libraries available in the ADO Work ...
0
votes
0answers
29 views
Export PnP reusable controls from SPFx library component
I am trying to export pnp reusable controls from SPFx library component by following this article:
https://www.m365-dev.com/2020/04/23/export-pnp-reusable-controls-from-spfx-library-component/
But ...
0
votes
0answers
16 views
Is it possible to get calendar events from my Outlook in SharePoint workbench after gulp serve using Microsoft Graph API?
I am using Microsoft Graph API to query Outlook Calendar events and display in SharePoint site. I followed this article:
https://www.c-sharpcorner.com/article/retrieve-calendar-events-using-microsoft-...
0
votes
1answer
48 views
Property 'selectedOptions','selectedIndex','options' does not exist on type 'HTMLElement'
I am working around with typescript in Sharepoint framework using No javascript approach. To get the dropdown text I am using the below code but it is not working:
var dept = (<HTMLElement>...
0
votes
1answer
38 views
Create columns in custom list using REST API with SPFx
Below is my code, every time I am getting 400, I am trying spHttpClient to create a column in a SP List..
Please suggest
SPFx Code
let listTitle = document.getElementById("txtListTitle"...
1
vote
1answer
23 views
SPFx node version keeps updating
I've built several SPFx web parts but now I'm getting errors because I'm "somehow" on node v12 which I don't believe works with SPFX. I certainly didn't update it so how has it switched to ...
0
votes
1answer
27 views
Rest api to get all Documents from all subsites
I have 5 subsites (Sub1,Sub2,Sub3,Sub4,Sub5) and all subsites is having Document library name (PublishedDocuments)
Sub1 - PublishedDocuments
Sub2 - PublishedDocuments
Sub3 - PublishedDocuments
Sub4 - ...
0
votes
0answers
18 views
Can I display a webpart as output of another webpart?
Can I output a webpart as part of another webpart rather than duplicating the HTML?
For example, if I have a 'Person' webpart that outputs a contact card, can I have a 'People' webpart that outputs a ...
0
votes
1answer
43 views
How to change dropdownItem color in office-ui-fabric-react?
I am new to SPFX and office-ui-fabric-react. I have a dropdownlist with below code and attributes:
<Stack tokens={stackTokens}>
<Dropdown placeholder="Select an option" label=&...
0
votes
1answer
15 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 '...
1
vote
1answer
45 views
I want to use sharepoint site asset folder for hosting client side files, where should I define this path in my spfx web part files?
I'm trying to host the JS files (webpart\temp\deploy) of my web-part in the asset library folder, but I'm not able to reference that in the config files.
In which file I have to defined that path? the ...
1
vote
1answer
44 views
Getting warning messages : Warning - [sass] The local CSS class 'min-chart' is not camelCase and will not be type-safe
I am using third party css in SPFx. When I am building it, SPFx is showing me lots of warning messages :
I am using Windows 10 / SPFx 1.11.0.
Please let me know how to disable these warning messages.
...
