pnp / sp-dev-fx-extensions Goto Github PK
View Code? Open in Web Editor NEWCode samples and developer content targeted towards SharePoint Framework client-side extensions. https://aka.ms/spfx-extensions
License: MIT License
Code samples and developer content targeted towards SharePoint Framework client-side extensions. https://aka.ms/spfx-extensions
License: MIT License
When using Microsoft Edge the ListView Command buttons should show when debugging.
Debugging ListView Commands work as expected when switching to Google Chrome, however don't render on Microsoft Edge.
npm install @microsoft/generator-sharepoint
yo @Microsoft/sharepoint
-Choose Extension
-Choose ListView Command Set
-Choose Default Command Set Name
-Choose Default Command Set Description
npm install
gulp serve --nobrowser
Open up SharePoint online website in Edge with the debugging query string. Browse to list and note the commands aren't there. Switch browser and use the same URL including the query string and note that it's working.
Will the Application Customizer in PageHeader placeholder get indexed as a content? Meaning if we store some custom metadata there, can we use search to look for the page?
I am working with the React Global Navigation SPFx Extension in this repo. I've noticed that when on a mobile device or within a very narrow browser, the navigation disappears instead of being collapsed into a mobile-friendly UI.
Is this the expected behavior with the CommandBar Office UI Fabric component?
On the Office UI Fabric site, these CommandBar items appear to auto-collapse which is the behavior I'm seeking (see the CommandBar with search box and overflowing menu items variant in the documentation).
If not, how can I extend this solution to collapse all command-bar items under an ellipses (overflowItems) at a given break-point?
Navigation should have the same design UI regardless of what page it is on and should work for mobile.
When running the extension samples for Application customizer. I get the following error. Error details: Error: Killswitches are not initialized. Killswitch requested: 19a3ca15-2aa2-4b0d-a563-4fbee7d77208
I have tried the Hello World extensions and that was working previously, but now has stopped working. Is this has anything to do with the extension being in dev preview?
Steps to Reproduce
In My Favourites, when displaying or editing an item, the Description field should show plain text, and selecting the hyperlink opens the page in the browser.
The Description field shows the text inside a div tag. Example - <div class="ExternalClass329AE126306642329FD1F51BD5071352">Test2</div>
When clicking the link in My Favourites, creates error, likely because link also has div tag. Example - https://sitename.sharepoint.com/testsub1/SitePages/%3Cdiv%20class=%22ExternalClassEAAE154620D849B3ABCB3EFE9537BF7E%22%3Ehttps://sitename.sharepoint.com/testsub1/SitePages/TestPage1.aspx?loadSPFX=true&debugManifestsFile=https://localhost:4321/temp/manifests.js&customActions={"5c715e3b-fb6f-43d7-a8a7-52bb5db34e50":{"location":"ClientSideExtension.ApplicationCustomizer","properties":{}}}</div>
Ran all the steps to install My Favourites sample on Windows 7 PC.
Freshly installed all tools for npm and related.
Manually created the Favourites list in SharePoint site.
Ran 'gulp serve' at command line, launching SharePoint site in IE 11 browser.
Used Add to My Favourites to create the item. Used Show My Favourites to display item. Saw div tag in Description. Clicked link and saw page error.
When building a ListViewCommandSet extension using the latest yeoman generator's default configurations with the following commands :
And we deploy the resulting .sppkg file to the app catalog, and we install the app on a site, we should see the list command button appear as expected when navigating in a library.
Nothing happens, both list command buttons do not appear, the script isn't even loaded in the Network tab of the browser. When debugging the extension using the URL query string and gulp serve, everything works perfectly, the load debug scripts modal appears, I can accept, then list extension is loaded and everything works.
However, when I deploy the official .sppkg to the app catalog, everything goes smoothly, I can install the app in my site collection, but once the app is finished installing nothing happens.
For Listview Command set, if RegID is 101, the command set should be deployed in document library.
Command set visible in List and not on Document Library
Elements.txt
@VesaJuvonen
Followed instructions on MS tutorial:
https://docs.microsoft.com/en-us/sharepoint/dev/spfx/extensions/get-started/building-simple-cmdset-with-dialog-api
I have read that changing the RegId fixes the issue but does not seems to be happening in my case.
SharePoint/sp-dev-docs#1628
Thanks for your contribution! Sharing is caring.
When a spfx extension app is deleted, it goes to the recycle bin (with 0 kb). I'd go to the recycle bin to delete the extension app again, and would receive this error message:
Sorry, something went wrong
An unexpected error has occurred.
TECHNICAL DETAILS
Troubleshoot issues with Microsoft SharePoint Foundation.
Correlation ID: c492469e-60a1-5000-1cdd-86f5344ecc11
This happens on multiple site collections, as well as with spfx web part app.
After an app is deleted, when I re-add the app (usually with an updated version number if there's modification), I could get one of these two responses (the screen cap is what's happening at the same time):
Sorry, something went wrong
A different version of this App is already installed with the same version number. You need to delete the app from the site and the site recycle bin to install this version.
TECHNICAL DETAILS
Troubleshoot issues with Microsoft SharePoint Foundation.
Correlation ID: 3e93469e-e044-5000-e9c5-ad565dc578d6
I'm not sure if this is preventing me from re-installing an updated app, or if it's constantly restoring, but the version number from newer pkkg does show when an app is re-added.
**Also having this issue 775 with web part app showing in some site toolbox gallery but not others, it's why I'm deleting apps and re-adding them, per recommendation as a fix.
Sample: Global Navbar.
Sorry but this doesn't deploy like any other extension I've used. I've copied over the files and published the package all successfully but adding the app to any site does nothing. It works perfectly in debug mode. What am I missing? Incidentally the ps1 script doesn't work either.
Same as debug mode
Nothing, no errors just nothing.
build and package solution in --ship
copy files to cdn
publish package
add app to modern site
Thanks.
When overflow menu is used the links no longer work.
When menu overflows the menu items are rendered but not clickable. How do i fix this?
Make screen small to cause overflow
The instructions on one of the samples should be this:
gulp serve --nobrowser
but there is a typo that will confuse those not familiar with gulp commands.
Running "gulp server --nobrowser" results in the error,
"Task 'server' is not in your gulpfile"
Go to the page for sample for "Modern Team Sites (Office Groups) Navigation Application Customizer" and follow instructions.
After instruction "npm i -g gulp" is the line "gulp server --nobrowser" that produces the error.
How can I create a modern webpage with an document library that has commanding toolbar?
Use the following form to submit an issue only if it's related to samples in this repo. If you have an issue related to the SharePoint Framework or its documentation, please submit the issue at https://github.com/SharePoint/sp-dev-docs/issues/new. This will help us respond to your issue faster.
Thank you for reporting an issue or suggesting an enhancement. We appreciate your feedback - to help the team to understand your needs, please complete the below template to ensure we have the necessary details to assist you.
If you are reporting a bug, please describe the expected behavior. If you are suggesting an enhancement please describe thoroughly the enhancement, how it can be achieved, and expected benefit.
The deployment instructions should say :-
add to the "Apps for SharePoint" library of the AppCatalog in your tenant the react-application-regions footer.spppkg file that you will find under the ./sharepoint/solution subfolder of the sample root folder
If you are reporting a bug, please describe the behavior you expected to occur when performing the action. If you are making a suggestion, you can delete this section.
The deployment instructions say :-
add to the "Apps for SharePoint" library of the AppCatalog in your tenant the spfx-discuss-now.spppkg file that you will find under the ./sharepoint/solution subfolder of the sample root folder
Thanks for your contribution! Sharing is caring.
Hi, Ive built an spfx extension, i started from jquery application toastr to build my code. This was working 👍
Ive tested using the url ?loadSPFX=true&debugManifestsFile=https://localhost:4321/temp/manifests.js&customActions={"a861c815-e425-416d-9520-04bcdf557e27":{"location":"ClientSideExtension.ApplicationCustomizer"}}
and deployed the .sppkg and it worked.
Then I added my code, now i get the following behavior
Using the debug url, i can see my spfx extension building.
Deployed using the package, i see nothing worrying from the console neither in the UI. How to further troubleshooting ?
I only see :
I shared my source code https://github.com/seaSide974/spfxmega.
It is a mega menu based on term store (using CSOM), using JQUERY.
Ive added the sppkg, no errors are showing on the app catalog, the feature is correctly on my site collection, i have added the app to the site collection.
The assets are in : /sites/devjeff/style library/MIS.GlobalNavigation.Modern/deploy/ (file generated from temp/deploy)
Thank you !
I'm trying out the SPFx Extensions Field Customizer, following this guide https://docs.microsoft.com/en-us/sharepoint/dev/spfx/extensions/get-started/building-simple-field-customizer
Successfully applied the percentage field customizer. when accessing nested item inside folder, the nested item should be rendered correctly, and the breadcrumb should work.
There are some unexpected behavior when navigating within the document library.
Follow the article, deploy the SPFx, and create following structure in the document library
-ROOT
--FolderA
---ItemA1
--ItemB
--ItemC
ItemB and ItemC rendered properly
Navigate into FolderA, ItemA1 will not rendered properly, I check from console.log, it seems the onRenderCell function still watching the root folder.
Use the list breadcrumb, click on Root folder, It will not redirect to root folder, instead will throw console error regarding knockout js and stuck on the folder.
refresh the page, and ItemA1 will be rendered correctly, and able to navigate to root folder using the breadcrumb.
After the step 3,
Use the following form to submit an issue only if it's related to samples in this repo. If you have an issue related to the SharePoint Framework or its documentation, please submit the issue at https://github.com/SharePoint/sp-dev-docs/issues/new. This will help us respond to your issue faster.
Thank you for reporting an issue or suggesting an enhancement. We appreciate your feedback - to help the team to understand your needs, please complete the below template to ensure we have the necessary details to assist you.
You do not need to drag and drop the deploy folder contents anymore in 1.4.0 as everything is packaged in the .sppkg file
Current Instructions say drag and drop deploy contents of folder.
Thanks for your contribution! Sharing is caring.
I am getting an following error while running application cutomiser extension
ERROR:
Killswitches are not initialized. Killswitch requested: aca19dad-e178-47bd-882e-5633af7b7ff0
can you let me know what is it?
Configured react-application-tenant-global-navbar on communication site. In the menu, one menu items takes to _layouts/15/search.aspx. One the home page of the site, when clicked on search menu item, search page will open. Clicking back button to go to earlier page takes back to site home page however, menu is not shown on the page.
Clicking back should show the home page with menu
Menu is not getting loaded
Create an item in the term site, in the URL provide https:///sharepoint.com/sites//_layouts/15/search.aspx
Open the site and click on that menu item to go to search page
on the search page click back button
Thank you for reporting an issue or suggesting an enhancement. We appreciate your feedback - to help the team to understand your needs, please complete the below template to ensure we have the necessary details to assist you.
Extension should load/render when navigating/"modern redirecting" to other site pages.
I have created an extension based on "react-application-tenant-global-navbar" sample.
When I navigate between site pages, extension is not loaded. If full postback/refresh extension is loaded/rendered.
Communication Site -> Deploy sample react-application-tenant-global-navbar and configure required terms.
Have installed the app to the SharePoint app catalog and it has been binding with no issues to site collection and today stopped working with the error:
The property 'ClientSideComponentId' cannot be found on this object. Verify that the property exists and can be set.
Powershell open with admin rights
PnP-Connect with global admin account
run tenant customiser script
Deploy sharepoint framework extension to my sharepoint site collection
My package not valid when upload it on my App Catalog
I try it with both, my sharepoint framework extension and with react-slider-field-customizer([https://github.com/SharePoint/sp-dev-fx-extensions/tree/master/samples/react-field-slider]) in both cases i get this:
my app packages is not valid.
Here is my configuration files:
package-solution:
I executed comands:
SPFx Extension Header flicker Issue.
To customize the Header we have used sharepoint extension model. Its Working but there is a Flicker in loading.
It Loads the Old Header (By Default header provided in modern pages) and then my extension work.
Extension should load without Flicker
To customize the Header we have used sharepoint extension model. Its Working but there is a Flicker in loading.
It Loads the Old Header (By Default header provided in modern pages) and then my extension work.
Thanks for your contribution! Sharing is caring.
Am following this article, and developed a command set. Deployed in my site collection, and able to see the commandset for my List. Step 6 says I have to run gulp serve --nobrowser
& its working only when the above command is running. I wanted this to work even when powershell is not running.
Step 6 says I have to run gulp serve --nobrowser
& its working only when the above command is running.
Deploy the command set in site collection following the exact steps in above said article. And test it.
When uploading a new file to a Document Librarary that uses SPFX Field Customizer Extension we expect the new item to also get the Field Customizer and that they are initialized.
Right now the default behaviour of the column is removed but the Field Customizer isn't added
Thank you for reporting an issue or suggesting an enhancement. We appreciate your feedback - to help the team to understand your needs, please complete the below template to ensure we have the necessary details to assist you.
Simple addition: I was searching for a way to remove the application customizer once deployed with PS, this can be done via:
$context = Get-PnPContext
$web = Get-PnPWeb
$context.Load($web)
Execute-PnPQuery
$web.UserCustomActions.Clear()
$context.Load($web.UserCustomActions)
Execute-PnPQuery
Also needed when running deploy more than once because it will load the customizer two times.
Run twice or try to delete the customizer
Tenant Global NavBar Application Customizer > Deployment
TenantGlobalNavBarProvisionCustomizer.ps1
Run twice or try to delete the customizer
Thanks for your contribution! Sharing is caring.
No matter if you use sample or try to generate extension from scratch
No errors in console when run gulp serve
set NODE_NO_HTTP2=1 && gulp serve
because of Node versionWhen you create an extension from scratch and use the name other than "HelloWorld", yeoman should change it in all places.
At this point no place to define "exportName": ""
Please advise!
Kind regards,
Kolia Nalbandian
Hello,
I have followed the deployment indcations but nothing happens when I run the script, even if I have no error in the shell, I do not see the menu in my site collection or in my site "modern". Can anyone help me ?
As documented here, this.context.placeholderProvider must be used in order to create content within a page placeholder.
After creating a ListCommandSet extension using the latest yeoman generator, the property placeholderProvider is not available within this.context.[...]
Create a new SPFX extension (list command set) and try looking for this.context.placeholderProvider
react-application-tenant-global-navbar
Category - Bug
Expected or Desired Behavior
The navbar is still visible on the page after the user navigates back from using the search page.
Observed Behavior
The Nav Bar disappears from the page when I navigate back from using the search page (new experinence).
Steps to Reproduce
Search in the left hand search box and click on 'Show more results'
Your are now in the new experience search results page.
Now click on the arrow on the left side (next to the Search term you entered)
When you are back on the page from which you performed the search the navbar is now missing.
I call the list api in my tenant with SPHttpClient, and get 403, also try to call same api using jQuery ger method wich work.
Can you tell me the recommended way to REST call from the Shared Point Extension?
Thank you.
Hi,
I have interesting use case - I'm using extensions for notifications to show some message to the user which is working fine when I do standard redirect to the page and extension is reloaded, but when I click on the link to redirect to other page in the same site then extension remains and only page content is reloaded which is expected with react (modern) routing, but I would like to call my function on each redirect (even on modern routing). Possibly it is not supported on extensions, but would you think to include such a feature in the future release - I mean some kind a function (e.g. onPageRouteChange) which would be only called in extension on modern routing, but extension would remain as is?
The issue I found is on the root site, e.g. https://tenant.sharepoint.com/SitePages/Home.aspx and then you navigate to SharePoint page (click on the link in suite bar) https://tenant.sharepoint.com/_layouts/15/sharepoint.aspx and click back button on your browser. Extension is not loaded then.
Thanks
Saulius
I am trying to connect to SharePoint term store using the JavaScript Object Model (JSOM) as explained here. But I am getting the below error:
Any idea?
Feature : SPFx Extension
If you are reporting a bug, please describe the expected behavior. If you are suggesting an enhancement please describe thoroughly the enhancement, how it can be achieved, and expected benefit.
If you are reporting a bug, please describe the behavior you expected to occur when performing the action. If you are making a suggestion, you can delete this section.
If you are reporting a bug please describe the steps to reproduce the bug in sufficient detail to allow testing. Only way to fix things properly, is to have sufficient details to reproduce it. If you are making a suggestion, you can delete this section.
Delete this section after reading
Thanks for your contribution! Sharing is caring.
I'm using SPComponentLoader to load SP.js and other files in a SPFx application extension. This works fine, if the extension is loaded on the start page of a web. But as soon as the extension is loaded on e.g. a document library (/Shared Documents/Forms/AllItems.aspx), the SPComponentLoader produces an unknown error when loading module.
This is the code that is supposed to work on every page:
SPComponentLoader.loadScript('/_layouts/15/init.js', {
globalExportsName: '$_global_init'
})
.then((): Promise<{}> => {
return SPComponentLoader.loadScript('/_layouts/15/MicrosoftAjax.js', {
globalExportsName: 'Sys'
});
})
.then((): Promise<{}> => {
return SPComponentLoader.loadScript('/_layouts/15/SP.Runtime.js', {
globalExportsName: 'SP'
});
})
.then((): Promise<{}> => {
return SPComponentLoader.loadScript('/_layouts/15/SP.js', {
globalExportsName: 'SP'
});
})
.then((): Promise<{}> => {
return SPComponentLoader.loadScript('/_layouts/15/SP.Taxonomy.js', {
globalExportsName: 'SP'
});
})
.then((): Promise<{}> => {
return SPComponentLoader.loadScript('/_layouts/15/SP.Search.js', {
globalExportsName: 'SP'
});
})
.then((): void => {
//code here
})
.catch((reason: any) => {
//...log error
});
When performing "gulp serve" on a new empty extension (app customizer) an error is thrown:
Killswitches are not initialized. Killswitch requested: aca19dad-e178-47bd-882e-5633af7b7ff0
CALL STACK:
Error: Killswitches are not initialized. Killswitch requested: aca19dad-e178-47bd-882e-5633af7b7ff0
at Function.e.isActivated (https://spoprod-a.akamaihd.net/files/sp-client-prod_2018-03-02.016/sp-core-library_en-us_7572ea1dfcf36c9fe486c603f1fb4180.js:70:14914)
at t._forEachPropertyWithMetaData (https://spoprod-a.akamaihd.net/files/sp-client-prod_2018-03-02.016/sp-webpart-base_en-us_6e989e91f47afa507f7a18d98578f5f8.js:84:25477)
at t._reInstateServerProcessedData (https://spoprod-a.akamaihd.net/files/sp-client-prod_2018-03-02.016/sp-webpart-base_en-us_6e989e91f47afa507f7a18d98578f5f8.js:84:24160)
at t._deserialize (https://spoprod-a.akamaihd.net/files/sp-client-prod_2018-03-02.016/sp-webpart-base_en-us_6e989e91f47afa507f7a18d98578f5f8.js:84:27069)
at t._internalDeserialize (https://spoprod-a.akamaihd.net/files/sp-client-prod_2018-03-02.016/sp-webpart-base_en-us_6e989e91f47afa507f7a18d98578f5f8.js:84:28284)
at https://spoprod-a.akamaihd.net/files/sp-client-prod_2018-03-02.016/sp-webpart-base_en-us_6e989e91f47afa507f7a18d98578f5f8.js:84:29330
at new Promise ()
at t._internalFirstTimeRender (https://spoprod-a.akamaihd.net/files/sp-client-prod_2018-03-02.016/sp-webpart-base_en-us_6e989e91f47afa507f7a18d98578f5f8.js:84:28874)
at e._initializeAndRenderWebPart (https://spoprod-a.akamaihd.net/files/sp-client-prod_2018-03-02.016/sp-pages-assembly_en-us_043bdad7f703a3fc5c0880b7c7495359.js:428:73263)
at https://spoprod-a.akamaihd.net/files/sp-client-prod_2018-03-02.016/sp-pages-assembly_en-us_043bdad7f703a3fc5c0880b7c7495359.js:428:59061
This seems to happen wherever web parts are on the page. It doesn't occur in library pages, for example. In my communication site the error doesn't show up in the console although the web parts don't load. In other pages the error shows on the page itself and is thrown to the console once I try to interact with the page like when attempting to edit it.
I'm on Windows 10 using SPFx framework v1.4.1, node v6.13.0, npm v3.10.10.
Instantiate a vanilla extension and serve it, as far as I can tell, on a page that has web parts in it.
Thank you for reporting an issue or suggesting an enhancement. We appreciate your feedback - to help the team to understand your needs, please complete the below template to ensure we have the necessary details to assist you.
The global menu loads up from term store and when clicked, the menu links should redirect the user to the appropriate link from the Term Store.
This is a great feature and exactly what I was looking for but have sadly run into a few issues. Any help would be greatly appreciated.
The global menu does loads up correctly from term store but the menus don't seem to have any HREF loaded from the Term Store. So they are not clickable links just plain text menu items.
This has been deployed in the tenancy app store.
I followed the steps to deploy as detailed in your instructions.
Thanks for your contribution! Sharing is caring.
Thank you for reporting an issue or suggesting an enhancement. We appreciate your feedback - to help the team to understand your needs, please complete the below template to ensure we have the necessary details to assist you.
Solution should build successfully. Already setup my dev machine and tested webpart on dev machine workbench and SharePoint Online workbench as well. Still the old solution working fine.
If you are reporting a bug, please describe the behavior you expected to occur when performing the action. If you are making a suggestion, you can delete this section.
With the new solution
When i am using gulp serve or gulp serve--, its throwing the following error
at Module.load (module.js:487:32) code: 'MODULE_NOT_FOUND' }
Error - Unknown
Cannot find module '@microsoft/node-core-library'
I have a solution similar to the js-application-appinsights sample which uses a spfx extension (application customizer) to inject Azure Application Insights on modern SharePoint pages.
However, I have noticed that this current sample (as well as my solution) are not capturing page views when navigating between pages on a modern SP site because a full post-back and DOM load isn't occurring.
How would you recommend a sample like this be extended to detect navigation changes? I'm aware of the navigatedEvent, but that's not usable given how this sample injects JS into the page. Off hand, the only option I can see would be to trigger a page view to be captured on hash change.
Any guidance or updates to this sample would greatly appreciated!
Page Views are tracked when navigating between pages in a modern SharePoint site.
Page Views are tracked by AAI when initially arriving on the page (window/DOM load) or when refreshing (F5) a page, but not when navigating between pages internally since the entire DOM isn't reloaded.
This behavior can be seen using the sp-dev-fx-extensions/samples/js-application-appinsights sample.
[BUG]
Dear Team,
I am having the unexpected behavior while running npm install command for the solution js-application-analytics. It gives me error 404 not found for a while. I assumed this might be due to old version installed on my laptop but that is also not the case as I updated SharePoint templates.
Other Solutions in the same git repository are working fine for me.
I am attaching the log file and error screen as well
2017-11-05T15_22_26_754Z-debug.log
Please let me know if I am doing something wrong.
Thanks and best regards,
Sumesh Kashyap
When a command bar is used in the top placeholder, it should show all menu items and the overflow menu when there is enough width available.
Often the command bar will load to 100% width but for some reason the entire menu is placed within the overflow menu and hidden in an ellipses. See attachment images for example.
This seems to happen the most when the menu is loaded in a document library. It's not all the time, but consistent enough to be an issue. When it happens, all menu items are available and function, they are just all tucked away under the ellipse.
I am using the https://github.com/SharePoint/sp-dev-fx-extensions/tree/master/samples/react-application-tenant-global-navbar extension in the production environment and it is working really well. So a big thank you first for the extension code.
It would be great if the menus are security trimmed similar to managed metadata navigation with friendly urls, which will only show menus if the user has access to the page the menu links to.
Currently, the menu from the term store is not security trimmed. Users will see the menu and if they click on a menu, which links to a page they don't have access to, it takes them to an access denied page. It would have been great to not show the menu at all.
Set up as detailed in the Readme and set a few of the menu terms to pages the user does not have access to.
Thanks for your contribution! Sharing is caring.
Use the following form to submit an issue only if it's related to samples in this repo. If you have an issue related to the SharePoint Framework or its documentation, please submit the issue at https://github.com/SharePoint/sp-dev-docs/issues/new. This will help us respond to your issue faster.
Thank you for reporting an issue or suggesting an enhancement. We appreciate your feedback - to help the team to understand your needs, please complete the below template to ensure we have the necessary details to assist you.
I'm using node 6.12, npm 3.10, and SPFx 1.4 on a Modern site.
I generate a commandset extension (new project), deploy - everything works as expected.
Now, I want to change the logic .. I want to show change the title of "COMMAND_1" to reflect the number of rows selected.
I change my onListViewUpdated as follows,
public onListViewUpdated(event: IListViewCommandSetListViewUpdatedParameters): void {
const compareOneCommand: Command = this.tryGetCommand('COMMAND_1');
if (compareOneCommand) {
// This command should be hidden unless exactly one row is selected.
compareOneCommand.visible = event.selectedRows.length > 0;
console.log(event.selectedRows.length);
compareOneCommand.title = "Selected " + event.selectedRows.length;
}
}
Now I go about selecting rows - but even though in debug mode event.selectedRows.length shows me the correct value, and compareOneCommand.title shows the proper value, the in UX, the title always says "Selected 0".
Expected: Selected x .. where x is number of rows selected.
The title always says "Selected 0" which is incorrect.
As above ..
**** UPDATE *****
I have put this issue at the right place -SharePoint/sp-dev-docs#1177 .. (ok to close this one)
According with this get started:
https://dev.office.com/sharepoint/docs/spfx/extensions/get-started/using-page-placeholder-with-extensions
after the command gulp serve I have the following error:
Error - [write-manifests] Manifest validation error (./src/extensions/appCustomizerHelloWorld/AppCustomizerHelloWorldApplicationCustomizer.manifest.json):
(#/) Data does not match any schemas from 'oneOf'
(#/) Missing required property: description
(#/alias) String is too long (44 chars), maximum 40
(#/componentType) No enum match for: Extension
(#/) Missing required property: preconfiguredEntries
(#/) Missing required property: commands
After the scaffolding I have to be able to run the client side web part
Please follow these guidelines:
https://dev.office.com/sharepoint/docs/spfx/extensions/get-started/build-a-hello-world-extension
https://dev.office.com/sharepoint/docs/spfx/extensions/get-started/using-page-placeholder-with-extensions
Thanks for your contribution! Sharing is caring.
As mentioned to test extensions, we need to run npm install at tutorial directory. But there is no package.json file due to which unable to install modules.
When running Field-Extension Tutorial sample not able to see add any webpart option.
follow the link Field-Extension Tutorial enter gulp serve.
Thanks for your contribution! Sharing is caring.
I would like to add a list view command set button dynamically based on the selected row
The button is not being shown/hidden dynamically
I'm using @microsoft/sp-listview-extensibility. I used the tutorial from link.
I'm checking if the selected row is present in FavouritesList(a SP list having all the favourite files/folders). If present, donot show the button else show the button. PFB the piece of code under onListViewUpdated method.
const addFavButton: Command = this.tryGetCommand('AddFavourite');
addFavButton.visible = false;
var selectedFavInList;
if (addFavButton) {
if (event.selectedRows.length === 1) {
var url = this.context.pageContext.web.absoluteUrl;
let web = new Web(url);
web.currentUser.get().then((user) => {
this.currentUserId = user.Id;
web.lists.getByTitle(FavouriteSource).items
.filter("(UserNameStringId eq " + this.currentUserId + ")")
.select("FolderUri,Id").get().then(favItems => {
this.favouriteItems = favItems;
selectedFavInList = jQuery.grep(this.favouriteItems, favItem => {
return favItem.FolderUri == event.selectedRows[0].getValueByName("FileRef");
});
if (selectedFavInList.length > 0) {
addFavButton.visible = false;
}
else {
addFavButton.visible = true;
}
});
});
}
}
Please help me understand how to accomplish the same.
How do we localize Command Sets? I noticed there is an id property on the items object in the manifest file, which has the following description:
"id": "$CommandSetTestCommandSetStrings:CommandSetTestCommandSetStrings.Command1;"
Is this expected behavior? Should I write the expression differently? Or is it a bug?
Hope someone can shine a light on this!
Thank you for reporting an issue or suggesting an enhancement. We appreciate your feedback - to help the team to understand your needs, please complete the below template to ensure we have the necessary details to assist you.
If you are reporting a bug, please describe the expected behavior. If you are suggesting an enhancement please describe thoroughly the enhancement, how it can be achieved, and expected benefit.
If you are reporting a bug, please describe the behavior you expected to occur when performing the action. If you are making a suggestion, you can delete this section.
If you are reporting a bug please describe the steps to reproduce the bug in sufficient detail to allow testing. Only way to fix things properly, is to have sufficient details to reproduce it. If you are making a suggestion, you can delete this section.
Delete this section after reading
Thanks for your contribution! Sharing is caring.
React-Application-BreadCrumb
Able to show the folder structure inside a document library
Currently, only the site name, doclib or list name will be used to compose the breadcrumb.
A declarative, efficient, and flexible JavaScript library for building user interfaces.
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google ❤️ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.