Forum Widgets
Latest Discussions
SPFx Webpart - not picking up any styles
I've just upgraded to the latest version of SPFx and when I build a project using yo it all works as expected (no errors), except it doesn't apply any of the styles. I've tried creating multiple projects, and across two different computers, and still the same issue. I've also tried in the workbench and deploying the solution (package). Is anyone else seeing this issue, or anything I need to do? Note that I'm using REACT framework option in the yo setup.
PageContext listItem.id Lag After Navigation in SPFx Web Part
Hi everyone, I'm running into an issue with an SPFx web part where this.context.pageContext.listItem.id appears to lag behind after navigating between pages using the SharePoint “Pages” tab (the left-hand nav on a SharePoint site, not a full browser reload). Here’s the behavior I’m seeing: I navigate to Page 1: listItem.id shows the correct ID for Page 1 I navigate to Page 2: listItem.id still shows the ID from Page 1 I navigate to Page 3: now it shows the ID for Page 2 This continues until I perform a full page refresh, which resets things correctly. It feels like there's a one-step delay in updating pageContext, possibly due to how SharePoint handles partial page loads or client-side routing. To try to work around this, I moved my logic from onInit() to render(), but the lag still exists intermittently. Has anyone else encountered this kind of lag with pageContext? Any guidance on best practices for detecting the current page reliably in SPFx when navigating within the SharePoint UI? Appreciate any insight — happy to share more details if helpful. Thanks!
Event Listeners Not Working After Translating SharePoint Page with SPFx Extension
Hello everyone, I'm developing a SharePoint Framework (SPFx) extension to translate SharePoint pages using a language viewer API. The extension includes a dropdown menu for language selection, and it successfully translates the page content based on the selected language. However, after the translation, all event listeners attached to elements on the page, such as the "Add New" functionality of the out-of-the-box (OOTB) list web part, stop working. Here are the steps I've taken so far: Reattached event listeners after applying translations. Despite these efforts, the issue persists. Has anyone encountered similar problems or have any suggestions on how to resolve this? Any insights or solutions would be greatly appreciated! Thank you in advance for your help!
PnP SingleWebPartAppPage removing all page contents
I am trying to convert a SharePoint page into a single web part app page to display a PowerBi report in full screen. I have tried creating the page, converting to "article" layout, adding the embed (both the PBI specific and the generic embed) webpart then running the script to convert to a single webpart app page. When I run the script, it is converting the page but it is removing the embedded web part. Here is my code: $clientId = "XXX" $clientSecret = "XXX" $tenantId = "XXX" $scope = "https://graph.microsoft.com/.default" # Use Microsoft Graph default scope for app-only authentication Connect-PnPOnline -Url example.com -ClientId $clientId -Tenant $tenantId -Certificatepath "C:\Users\User\Example" -CertificatePassword (ConvertTo-SecureString -AsPlainText "Example" -Force) if(Get-PnPConnection) { Set-PnPPage -Identity "Example.aspx" -LayoutType singleWebPartAppPage } else { Write-Host "Connection failed. Please check your credentials and try again." Any help or advice would be greatly appreciated.
Custom Coloring for SharePoint List Pills
Hello! Not great at coding but hoping somebody can help. I have a SharePoint that I'd like to custom color the choice pills based on the hex codes below. 1-CORP #67a3c7 5-MPE #5f497a 6-THETIS #e5bd00 10-ENERGY #829900 11-MPI #6a1532 14-MUSI #0b2e6a 15-MPLI #0b5b58 18-MUCI #c88ca4 20-MICON #8bc19f 21-MCI #ff7b2e 22-AMI #0a7e8c 24-MRSI #7f5c33 26-MTI #bf4f51 60-MTG #a43482 61-JDH #4f2cd0 101-MTPL #9c7c38 201-MTCI #005b39 202-MCJV #902d0e AC #a6a6a6 This is the current JSON in the list: { "$schema": "https://developer.microsoft.com/json-schemas/sp/v2/column-formatting.schema.json", "elmType": "div", "style": { "flex-wrap": "wrap", "display": "flex" }, "children": [ { "elmType": "div", "style": { "box-sizing": "border-box", "padding": "4px 8px 5px 8px", "overflow": "hidden", "text-overflow": "ellipsis", "display": "flex", "border-radius": "16px", "height": "24px", "align-items": "center", "white-space": "nowrap", "margin": "4px 4px 4px 4px" }, "attributes": { "class": { "operator": ":", "operands": [ { "operator": "==", "operands": [ "[$KCO]", "1-CORP" ] }, "sp-css-backgroundColor-BgCornflowerBlue sp-css-color-CornflowerBlueFont", { "operator": ":", "operands": [ { "operator": "==", "operands": [ "[$KCO]", "5-MPE" ] }, "sp-css-backgroundColor-BgMintGreen sp-css-color-MintGreenFont", { "operator": ":", "operands": [ { "operator": "==", "operands": [ "[$KCO]", "6-THETIS" ] }, "sp-css-backgroundColor-BgGold sp-css-color-GoldFont", { "operator": ":", "operands": [ { "operator": "==", "operands": [ "[$KCO]", "" ] }, "", { "operator": ":", "operands": [ { "operator": "==", "operands": [ "[$KCO]", "10-MEG" ] }, "sp-css-backgroundColor-BgCoral sp-css-color-CoralFont", { "operator": ":", "operands": [ { "operator": "==", "operands": [ "[$KCO]", "11-MPI" ] }, "sp-css-backgroundColor-BgDustRose sp-css-color-DustRoseFont", { "operator": ":", "operands": [ { "operator": "==", "operands": [ "[$KCO]", "14-MUSI" ] }, "sp-css-backgroundColor-BgCyan sp-css-color-CyanFont", { "operator": ":", "operands": [ { "operator": "==", "operands": [ "[$KCO]", "15-MPLI" ] }, "sp-css-backgroundColor-BgPeach sp-css-color-PeachFont", { "operator": ":", "operands": [ { "operator": "==", "operands": [ "[$KCO]", "18-MUCI" ] }, "sp-css-backgroundColor-BgSage sp-css-color-SageFont", { "operator": ":", "operands": [ { "operator": "==", "operands": [ "[$KCO]", "20-MICON" ] }, "sp-css-backgroundColor-BgLightPurple sp-css-color-LightPurpleFont", { "operator": ":", "operands": [ { "operator": "==", "operands": [ "[$KCO]", "21-MCI" ] }, "sp-css-backgroundColor-BgViolet sp-css-color-VioletFont", { "operator": ":", "operands": [ { "operator": "==", "operands": [ "[$KCO]", "22-AMI" ] }, "sp-css-backgroundColor-BgLightBlue sp-css-color-LightBlueFont", { "operator": ":", "operands": [ { "operator": "==", "operands": [ "[$KCO]", "24-MRSI" ] }, "sp-css-backgroundColor-BgMauve sp-css-color-MauveFont", { "operator": ":", "operands": [ { "operator": "==", "operands": [ "[$KCO]", "26-MTI" ] }, "sp-css-backgroundColor-BgLilac sp-css-color-LilacFont", { "operator": ":", "operands": [ { "operator": "==", "operands": [ "[$KCO]", "60-MTG" ] }, "sp-css-backgroundColor-BgLightGray sp-css-color-LightGrayFont", { "operator": ":", "operands": [ { "operator": "==", "operands": [ "[$KCO]", "61-JDH" ] }, "sp-css-backgroundColor-BgBlue sp-css-color-WhiteFont", { "operator": ":", "operands": [ { "operator": "==", "operands": [ "[$KCO]", "101-MTPL" ] }, "sp-css-backgroundColor-BgGreen sp-css-color-WhiteFont", { "operator": ":", "operands": [ { "operator": "==", "operands": [ "[$KCO]", "201-MTCI" ] }, "sp-css-backgroundColor-BgBrown sp-css-color-WhiteFont", { "operator": ":", "operands": [ { "operator": "==", "operands": [ "[$KCO]", "202-MCJV" ] }, "sp-css-backgroundColor-BgDarkRed sp-css-color-WhiteFont", { "operator": ":", "operands": [ { "operator": "==", "operands": [ "[$KCO]", "AC" ] }, "sp-css-backgroundColor-BgRed sp-css-color-WhiteFont", "sp-field-borderAllRegular sp-field-borderAllSolid sp-css-borderColor-neutralSecondary" ] } ] } ] } ] } ] } ] } ] } ] } ] } ] } ] } ] } ] } ] } ] } ] } ] } ] } ] } ] } }, "txtContent": "[$KCO]" } ] }
Display Issue opening files via Sharepoint "Open in App"
Hello MS Tech Community, We frequently work with CAD files/programs on SharePoint. Using SharePoint’s "Open in App" feature, we can open and edit CAD files directly in the desired CAD application. However, we have encountered the following issue: When we open CAD files via the "Open in App" feature, the user interface in several CAD programs is misaligned. Buttons appear disproportionately large, the drawing window is too small, and the entire display is distorted. However, when we open the same file through File Explorer (e.g., via OneDrive synchronization), the file is displayed correctly without any issues. Affected programs: Archicad, Cadwork, Rhino This issue has been occurring since we first started working with CAD files on SharePoint, approximately 3–4 months ago. It still persists, and we tested it again last week with the same result. My colleagues are experiencing the exact same issue. We’ve tried different devices and users. The support of the affected programs didn't have any solution, so we asume it's a sharepoint / onedrive issue. We also contacted the Microsoft Support. They told us to open a ticket in this community. We have some console logs of the file openig process. There are some differences when we open it in the local file System and via "Open in App" in Sharepoint. Does anyone have any ideas on how to solve this problem or has experienced something similar? We would be grateful for any help or suggestions. Thank you in advance and best regards,
SPO connection via client id/secret
hi all, I am trying to get the SPO site name but when running locally I get this error: "Invalid RedirectURI was received. Not parseable into System.Uri class." I thought you can use client id/secret with proper api permission to connect to SPO with no issues... Below the code I use. Thanks! ------------------------ Imports Microsoft.SharePoint.Client Imports System.Net Imports System.Security Imports PnP.Frameworks Public Class index Inherits System.Web.UI.Page Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load Dim siteUrl As String = "https://mysite.sharepoint.com/sites/admin" Dim clientId As String = "xxxxxxxxx" Dim clientSecret As String = "yyyyyyyyy" Dim tenantId As String = "555555555555" Dim siteName As String = GetSharePointSiteName(siteUrl, clientId, clientSecret, tenantId) Label1.Text = ("Site Name: " & siteName) End Sub Function GetSharePointSiteName(siteUrl As String, clientId As String, clientSecret As String, tenantId As String) As String Dim authManager As New PnP.Framework.AuthenticationManager(clientId, clientSecret, tenantId) Using context As ClientContext = authManager.GetContext(siteUrl) Dim web As Web = context.Web context.Load(web, Function(w) w.Title) context.ExecuteQuery() Return web.Title End Using End Function End Class
Microsoft Graph API returns 404 when querying SharePoint file by siteId, listId, uniqueId
I'm retrieving the JSON representation of a SharePoint page using the endpoint: GET https://graph.microsoft.com/v1.0/sites/${siteId}/pages/${pageId}/microsoft.graph.sitePage?expand=canvasLayout&select=id,name,webUrl,title,description,createdBy,canvasLayout,parentReference I receive a JSON structure like this. { "@odata.type": "#microsoft.graph.standardWebPart", "id": "e90803f3-30a5-4ef5-8c7e-1056966a2930", "webPartType": "b4cc345e-35ed-4b30-bc91-a7d6d249494f", "data": { "dataVersion": "1.3", "description": "This is an example description.", "title": "Stream", "properties": { "label": "This is an example property", "isTitleEnabled": true, "templateId": 1, "maxItemsPerPage": 3, "maxRowsPerPageGrid": 5, "maxRowsPerPageTheater": 1, "hideWebPartWhenEmpty": true, "sourceType": "VIDEO", "listSortField": "Created", "playlistSortField": "Default", "isPlaceholderState": false, "dataProviderId": "StreamVideo", "layoutId": "Theater", "webId": "cf329d30-484e-4b9f-9378-533152cfcd3f", "siteId": "6688e890-8000-4a19-9839-905b54adb407", "spWebUrl": "https://example.sharepoint.com/sites/ExampleSite", "previewUrl": "https://example.sharepoint.com/_api/v2.1/sites/example.sharepoint.com,6688e890-8000-4a19-9839-905b54adb407,cf329d30-484e-4b9f-9378-533152cfcd3f/lists/9b049de0-9a77-4169-bd45-6dc32cf99264/items/e2ae18de-a4f2-412d-a5c8-b8e340ef9e90/driveItem/thumbnails/0/c400x99999/content?prefer=noRedirect,extendCacheMaxAge&clientType=modernWebPart", "videoDuration": 145100000, "listId": "9b049de0-9a77-4169-bd45-6dc32cf99264", "rootFolder": "/sites/ExampleSite/Shared Documents/ExampleFolder/movie.mp4", "uniqueId": "e2ae18de-a4f2-412d-a5c8-b8e340ef9e90", "listTitle": "Title Example", "serverRelativePath": "/sites/ExampleSite/Shared Documents/ExampleFolder/movie.mp4", "link": "https://example.sharepoint.com/sites/ExampleSite/Shared Documents/ExampleFolder/movie.mp4", "wopiurl": "/sites/ExampleSite/Shared Documents/ExampleFolder/movie.mp4", "serverRelativeUrl": "/sites/ExampleSite/Shared Documents/ExampleFolder/movie.mp4", "webAbsoluteUrl": "https://example.sharepoint.com/sites/ExampleSite", "file": "https://example.sharepoint.com/sites/ExampleSite/Shared Documents/ExampleFolder/movie.mp4", "query": { "@odata.type": "#graph.Json", "contentLocation": 1, "email address removed for privacy reasons": "#Collection(Int32)", "contentTypes": [ 3 ], "email address removed for privacy reasons": "#Collection(Int32)", "documentTypes": [ 11 ], "sortType": 6 }, "displayMaps": { "1": { "@odata.type": "#graph.Json", "cardType": { "@odata.type": "#graph.Json", "email address removed for privacy reasons": "#Collection(String)", "sources": [ "CardType" ] }, "telemetryProperties": { "@odata.type": "#graph.Json", "email address removed for privacy reasons": "#Collection(String)", "sources": [ "TelemetryProperties" ] }, "accentColor": { "@odata.type": "#graph.Json", "email address removed for privacy reasons": "#Collection(String)", "sources": [ "AccentColor" ] }, "initials": { "@odata.type": "#graph.Json", "email address removed for privacy reasons": "#Collection(String)", "sources": [ "Initials" ] }, "previewUrl": { "@odata.type": "#graph.Json", "email address removed for privacy reasons": "#Collection(String)", "sources": [ "PreviewUrl", "PictureThumbnailURL" ] }, "headingText": { "@odata.type": "#graph.Json", "email address removed for privacy reasons": "#Collection(String)", "sources": [ "SiteTitle" ] }, "itemUrl": { "@odata.type": "#graph.Json", "email address removed for privacy reasons": "#Collection(String)", "sources": [ "WebPath" ] }, "listItemId": { "@odata.type": "#graph.Json", "email address removed for privacy reasons": "#Collection(String)", "sources": [ "listItemId" ] }, "iconUrl": { "@odata.type": "#graph.Json", "email address removed for privacy reasons": "#Collection(String)", "sources": [ "IconUrl" ] }, "activity": { "@odata.type": "#graph.Json", "email address removed for privacy reasons": "#Collection(String)", "sources": [ "ModifiedDate" ] }, "spWebUrl": { "@odata.type": "#graph.Json", "email address removed for privacy reasons": "#Collection(String)", "sources": [ "SPWebUrl" ] }, "uniqueId": { "@odata.type": "#graph.Json", "email address removed for privacy reasons": "#Collection(String)", "sources": [ "UniqueID" ] }, "imageOverlapText": { "@odata.type": "#graph.Json", "email address removed for privacy reasons": "#Collection(String)", "sources": [ "ImageOverlapText" ] }, "fileExt": { "@odata.type": "#graph.Json", "email address removed for privacy reasons": "#Collection(String)", "sources": [ "FileType" ] }, "tipActionButtonIcon": { "@odata.type": "#graph.Json", "email address removed for privacy reasons": "#Collection(String)", "sources": [ "TipActionButtonIcon" ] }, "className": { "@odata.type": "#graph.Json", "email address removed for privacy reasons": "#Collection(String)", "sources": [ "ClassName" ] }, "tipActionLabel": { "@odata.type": "#graph.Json", "email address removed for privacy reasons": "#Collection(String)", "sources": [ "TipActionLabel" ] }, "imageOverlapTextAriaLabel": { "@odata.type": "#graph.Json", "email address removed for privacy reasons": "#Collection(String)", "sources": [ "ImageOverlapTextAriaLabel" ] }, "name": { "@odata.type": "#graph.Json", "email address removed for privacy reasons": "#Collection(String)", "sources": [ "Name" ] }, "personImageUrl": { "@odata.type": "#graph.Json", "email address removed for privacy reasons": "#Collection(String)", "sources": [ "ProfileImageSrc" ] }, "title": { "@odata.type": "#graph.Json", "email address removed for privacy reasons": "#Collection(String)", "sources": [ "UserName", "Title" ] } }, "@odata.type": "#graph.Json" } }, "serverProcessedContent": { "htmlStrings": [], "searchablePlainTexts": [ { "key": "title", "value": "example_value" } ], "links": [ { "key": "baseUrl", "value": "/sites/SiteExample" } ], "imageSources": [] } } } From the response, I parse out file metadata that’s attached to the page. For each file, I extract the following fields from data.properties: - uniqueId - listId - siteId Then I attempt to retrieve detailed information about the file using the request: GET https://graph.microsoft.com/v1.0/sites/${siteId}/lists/${listId}/items/${uniqueId}/driveItem?select=id,size,parentReference,name,webUrl,file,createdBy,folder This request works for most files. However, for some files—despite having the correct uniqueId, listId, and siteId and even when I can manually verify that the file exists—the request returns a 404 error. I need the detailed JSON response mainly to obtain the webUrl to download the file. My questions are: 1. Why might some files return a 404 even though their metadata appears correct? 2. What alternative approach (e.g., using a different endpoint) can I use to reliably obtain the full JSON details for these file attachments? Any insights or suggestions would be appreciated.How to use operators in URL filters?
Hi! I'm trying to use the Contains filter operator in my modern SharePoint list, and it's ignoring that parameter. I've tried using a greater-than operator with a numeric field, and it also ignores that. https://xxxxxxx.com/sites/xxxxxxx/Lists/xxxxxxx/xxxxxx.aspx?FilterField1=status&FilterOp1=Contains&FilterValue1&pend&FilterType1=Text I want it to return all results that contain "pend" in the status column. How should I use it? I can't use the view configuration because the filtering is meant to be dynamic. The user, using an SPFx ListViewCommandSet extension, has a button that allows them to filter with operators. We're really stuck on this. Thanks!
