How to add JSLink to a field through pnp?
-
07-02-2021 - |
سؤال
I am trying to add a JSLink to my field through pnp so that it displays diffrently in the edit/new mode in the list that it is connected to, the problem i am having is that pnp throws an unknown error when i am running this command (Reference):
Set-PnPField -Identity KIT_sc_ProjectType -Values @{JSLink="~sitecollection/siteassets/jslink/groupcreation_grouptemplates.js";Group="KIT Fields"} -UpdateExistingLists
this the error i am getting back:
Set-PnPField : unknown error At line:1 char:1 + Set-PnPField -Identity KIT_sc_ProjectType -Values @{JSLink="~sitecoll ... + ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ + CategoryInfo : WriteError: (:) [Set-PnPField], ServerException + FullyQualifiedErrorId : EXCEPTION,SharePointPnP.PowerShell.Commands.Fields.SetField
Is it possible to add JSLink some another way to a field?
المحلول 4
I needed to enable "Custom Script" in "https://tenantname-admin.sharepoint.com/_layouts/15/online/TenantSettings.aspx".
Everything works now, i was able to run it with pnp.
نصائح أخرى
Set the JSLink to a field using JSOM:
<script type="text/javascript">
ExecuteOrDelayUntilScriptLoaded(setJslink, 'sp.js');
function setJslink()
{
var context = new SP.ClientContext.get_current();
var web = context.get_web();
var field = web.get_availableFields().getByTitle("Description");
context.load(field);
context.executeQueryAsync(function(){
field.set_jsLink("~sitecollection/SiteAssets/suggestion.js");
field.updateAndPushChanges(true);
context.executeQueryAsync(function(){
var jsl = field.get_jsLink();
console.log(jsl);
});
});
}
</script>
Reference:
There are several ways to add the JavaScript (JSLink) in Content Editor Web Part to the page: JS, CSOM note that the URL link should be added to ContentLink:
var siteUrl = '/sites/MySiteCollection';
var serverRelativeUrl = '/sites/MySiteCollection/Default.aspx';
function addWebPart() {
var clientContext = new SP.ClientContext(siteUrl);
var oFile = clientContext.get_web().getFileByServerRelativeUrl(serverRelativeUrl);
var limitedWebPartManager = oFile.getLimitedWebPartManager(SP.WebParts.PersonalizationScope.shared);
var webPartXml = '<?xml version=\"1.0\" encoding=\"utf-8\"?>' +
'<WebPart xmlns:xsi=\"http://www.w3.org/2001/XMLSchema-instance\"' +
' xmlns:xsd=\"http://www.w3.org/2001/XMLSchema\"' +
' xmlns=\"http://schemas.microsoft.com/WebPart/v2\">' +
'<Title>My Web Part</Title><FrameType>Default</FrameType>' +
'<Description>Use for formatted text, tables, and images.</Description>' +
'<IsIncluded>true</IsIncluded><ZoneID></ZoneID><PartOrder>0</PartOrder>' +
'<FrameState>Normal</FrameState><Height /><Width /><AllowRemove>true</AllowRemove>' +
'<AllowZoneChange>true</AllowZoneChange><AllowMinimize>true</AllowMinimize>' +
'<AllowConnect>true</AllowConnect><AllowEdit>true</AllowEdit>' +
'<AllowHide>true</AllowHide><IsVisible>true</IsVisible><DetailLink /><HelpLink />' +
'<HelpMode>Modeless</HelpMode><Dir>Default</Dir><PartImageSmall />' +
'<MissingAssembly>Cannot import this Web Part.</MissingAssembly>' +
'<PartImageLarge>/_layouts/images/mscontl.gif</PartImageLarge><IsIncludedFilter />' +
'<Assembly>Microsoft.SharePoint, Version=13.0.0.0, Culture=neutral, ' +
'PublicKeyToken=94de0004b6e3fcc5</Assembly>' +
'<TypeName>Microsoft.SharePoint.WebPartPages.ContentEditorWebPart</TypeName>' +
'<ContentLink xmlns=\"http://schemas.microsoft.com/WebPart/v2/ContentEditor\">' + '/sites/SiteAssets/Test.js</ContentLink>' +
'<Content xmlns=\"http://schemas.microsoft.com/WebPart/v2/ContentEditor\">' +
'<![CDATA[This is a first paragraph!<DIV> </DIV>And this is a second paragraph.]]></Content>' +
'<PartStorage xmlns=\"http://schemas.microsoft.com/WebPart/v2/ContentEditor\" /></WebPart>';
var oWebPartDefinition = limitedWebPartManager.importWebPart(webPartXml);
this.oWebPart = oWebPartDefinition.get_webPart();
limitedWebPartManager.addWebPart(oWebPart, 'Left', 1);
clientContext.load(oWebPart);
clientContext.executeQueryAsync(Function.createDelegate(this, this.onQuerySucceeded), Function.createDelegate(this, this.onQueryFailed));
}
function onQuerySucceeded() {
alert('Web Part added: ' + oWebPart.get_title());
}
function onQueryFailed(sender, args) {
alert('Request failed. ' + args.get_message() + '\n' + args.get_stackTrace());
}
Set JS Link using PNP Field, just remove tilt sign from jslink path. JSLink properties requires relative path without any placeholder. it will automatically add your current site url before '/'
Set-PnPField -Identity KIT_sc_ProjectType -Values @{JSLink="/siteassets/jslink/groupcreation_grouptemplates.js";Group="KIT Fields"} -UpdateExistingLists