New answers tagged spfx
1
but isn't this issue no different than what we all have experienced for some time now, no matter the tech stack, framework, tools, etc we work with? I know for me i have been frustrated with this issue ever since the days of java bloat, oracle nightmare APIs, javascript, browser incompatibility, etc. I'm sure you have your own nightmare stories, but the ...
4
There is a way to avoid this situation in a slightly better way. You don't know how third party css library might affect other SharePoint components. That's why if your library has sass sources, you can compile it in such a way, that it reacts only to certain css classes.
How to do that based on the materialize:
Install materialize - npm install ...
2
Unfortunately, no, there is no real way to keep that from leaking out. The problem is, when you use a styling library like that, it's going to have some very broad selectors included, and those are possibly going to affect certain things on the page, unless SharePoint's built in CSS has selectors that are more specific and therefore override the library.
...
0
My mistake, the page URL is for debugging and workbench, I deployed to app catalog and works fine for all the lists! sorry
0
@microsoft/sp-build-web should be installed when you run npm install the first time.
In package.json, this is referenced in the devDependencies section:
"devDependencies": {
"@microsoft/sp-build-web": "1.4.1",
"@microsoft/sp-module-interfaces": "1.4.1",
"@microsoft/sp-webpart-workbench": "1.4.1",
"@types/chai": "3.4.34",
"@types/mocha": ...
0
It looks like you are missing the ending single quote. Update the API call to:
_api/search/query?querytext='IsDocument:True AND FileExtension:aspx AND PromotedState:2'
Furthermore, you'll need to encode this to use it. Change your spaces to %20 and your single quotes to %27 like this:
_api/search/query?querytext=%27IsDocument:True%20AND%...
0
The owner receives a SP.Principal. In this case the owner it's a group.
Unfortunately it doesn't put the user I chose but the user that created the group
import { sp, Web, PrincipalSource, PrincipalType, PrincipalInfo } from "@pnp/sp";
sp.utility.resolvePrincipal(managersGroupName,
PrincipalType.SharePointGroup,
PrincipalSource.UserInfoList,
false,
...
2
Adding await fixed it! (microsoft should update the docs)
Fix:
// get terms merged with data from a term set
const terms4: (ITerm & ITermData)[] = await store.getTermSetById("0ba6845c-1468-4ec5-a5a8-718f1fb05431").terms.get();
1
While not documented, no you shouldn't need to.
1
Site Collection app catalogs are only supported in SharePoint Online. Instead, you have to use the centralized farm-wide app catalog.
0
Follow below steps:
Copy a single/specific folder corresponding the web-part you want to use.
Open that folder in Node JS command prompt.
Run the command: npm install.
Run the command: gulp build.
If there are any errors in code then fix it.
If you see any error while importing libraries then you need to install those using npm.
Run the command: gulp ...
1
Try running below commands in your package folder:
npm install
npm install @pnp/spfx-property-controls --save --save-exact
gulp serve
gulp trust-dev-cert
Then while packaging your solution run below commands:
gulp build
gulp bundle --ship
gulp package-solution --ship
official documentation: Host your client-side web part from Office 365 CDN.
1
When you run locally it run without error because all file are run from local but upload package (i.e. sppkg), still your file are resides locally. If you read error it is specifying that local server is not running.
Kindly follow
https://docs.microsoft.com/en-us/sharepoint/dev/spfx/web-parts/get-started/hosting-webpart-from-office-365-cdn
above ...
0
So, the basic logic for this action is (using onToggleCollapse callback):
private _onToggleCollapse(props: IGroupDividerProps): () => void {
...
if (props.group.data.isLoaded === false && props.group.isCollapsed === false && props.group.level > 0) {
...
let data: any = this._getGroupItems(props.group, isLoadAll, {}).then((...
0
you can use a REST query as below
/_api/web/lists/getByTitle('Pages')/items?$select=Id,Title
it will return an object obj.d.results (results is an array)
0
You can use the callback from iframeOnLoad. Check the url to see ith the dialog should stay open. If not: just call the dissmiss handler like this:
<IFrameDialog
url={state.iframeUrl} hidden={!state.iframeShow}
iframeOnLoad={(iframe) => this.onIFrameLoad(iframe)}
onDismiss={(event) => this.onIFrameDismiss(event)}
...
0
Check the below steps for adding multiple language in SharePoint Framework(SPFx) webparts:
Within "loc" folder you will see a file named "mystrings.d.ts". At first add property here like below:
declare interface ITestWebPartStrings {
WebpartTitle: string;
}
There is a file for english language named "en-us.js". If you want to
add another language you ...
-1
Use this:
<td>${item.LookupColumn.Title}</td>
//add .Title or .Tilte if that's the correct one.
0
You have several solutions, by injecting additional routines in the OnInit or ComponentWillMount method.
One mentioned in comments by @Karthik, by using in your code the utility SPComponentLoader.loadCss with an external file.
The second it’s adding inline CSS into the head of the current page such as this sample: https://github.com/SharePoint/sp-dev-fx-...
0
If you are using PnPjs this is quite easy:
let filePath = this.context.pageContext.site.serverRelativeUrl + '/Documents/Test.docx';
let updateProperties = {
Title: 'Updated title',
AnotherColumn: 'Another value'
};
sp.web.getFileByServerRelativeUrl(filePath).getItem().then((listItem:Item) => {
listItem.update(updateProperties);
});
1
You could add the CSS at end of your webpart .scss file.
1
Create a file , let's say customCSS.css inside your component folder and paste the below code :
div[class^='pageTitle_']{
display: none ;
}
Now in your main .ts file call this css file with the following syntax on top of the code :
require("../../webparts/WebpartName/components/customCSS.css");
Let me know if this helps.
0
I eventually found out that for SPFx v1.1 you cannot use Node v10, you must use Node v8, so I had to install NVM for Windows, and am using Node v8.16.2 while working on the SPFx webpart project.
1
I have not tried this but can you try like this :
First webpart's config.json
{
"$schema": "https://developer.microsoft.com/json-schemas/core-build/serve.schema.json",
"port": 4321,
"https": true,
"initialPage": "https://localhost:5432/workbench",
"api": {
"port": 5432,
"entryPath": "node_modules/@microsoft/sp-webpart-workbench/lib/api/"
}
}...
1
Reason:
SharePoint 2016 does not support SPFx extensions.
This is because SharePoint 2016 on-premises doesn't support Modern UI.
SharePoint Extensions are supported only in SharePoint 2019 and SharePoint Online as of now.
Solution:
In order to create a SharePoint Extension choose any one of the below options for the question, Which baseline packages do ...
1
You have to select "SharePoint Online only (latest)" or "SharePoint 2019 onwards, including SharePoint Online" for the question Which baseline packages do you want to target for your component(s)? to get option for "Extension".
If the answer is helpful, please upvote and mark as accepted.
0
Go straight to the source. Fiddle the web traffic and look at the raw response from the server. Alternately you might have luck looking at the Network tab in Chrome dev tools.
1
Based on the screenshot of your console output for responseJSON it looks like the message property is buried under a property called error.
You should be able to read the message by accessing responseJSON.error.message
1
Kumar,
This kind of behaviour can happen if you use DOM manipulation in your web part (e.g.: find an element by CSS class or I'd and change its attributes) to display the data.
What happens is the last web part to load results overrides all elements in the page, including the ones from the other web parts, essentially overwriting every web part to display ...
Top 50 recent answers are included
