web-dev-qa-db-fra.com

Comment créer un lien hypertexte dynamique de plus de 255 caractères dans SharePoint Online

Ma configuration:

  • SharePoint Online (faisant partie d'Office 365)
  • Pas d'accès aux solutions serveur codées (.NET)
  • Bibliothèque de documents utilisant le type de contenu Ensemble de documents
  • Nouvelle interface utilisateur d'expérience activée

Cas d'utilisation:

J'ai un workflow SP2013 qui permet à un utilisateur de faire une demande de changement pour un document dans la bibliothèque. Le flux de travail a des paramètres de formulaire d'initiation et les données fournies pour ces paramètres, ainsi qu'une référence à l'élément sur lequel le flux de travail a été exécuté, sont écrites dans une autre liste du site. Tout cela fonctionne très bien.

Ce que j'essaie de faire est de créer une colonne dans la bibliothèque de documents qui permet à un utilisateur d'accéder directement au formulaire d'initiation du flux de travail au lieu d'avoir à cliquer avec le bouton droit de la souris sur l'élément, de choisir "Avancé", puis "Flux de travail".

Le lien vers la page du formulaire d'initiation du flux de travail (extrait directement de la barre d'adresse du navigateur lorsque vous y accédez manuellement) ressemble au total à ceci (ajout de sauts de ligne pour la lisibilité):

https://company.sharepoint.com/sites/ABC/wfsvc/e73969f753574a3bb30c8d3ce3ab9c56/WFInitForm.aspx

?List={f9b73015-1131-442d-95b8-9682149a27e6}

&ID=5

&ItemGuid={71AA92CE-2D37-4D43-B593-AB6004E9DCF0}

&TemplateID={64193686-AB59-4D44-B0EB-FBD8E2CB7A1F}

&WF4=1

&Source=https%3A%2F%2Fcompany%2Esharepoint%2Ecom%2Fsites%2FABC%2FCourseDocuments%2FForms%2FCourseDocuments%2Easpx%3FRootFolder%3D%252Fsites%252FDCU%252FCourseDocuments%252FBasic%2520Stuff%26FolderCTID%3D0x0120D52000E334520C326BA440BF6F86F3CA80AE2800E3DBD1BD3A1EA348A9D944A931464C4D

Les parties ID et ItemGuid du lien devront être dynamiques car elles contiendront une référence au document de bibliothèque spécifique sur lequel le flux de travail devra être exécuté. Tout le reste est statique.

Pour produire dynamiquement cette URL pour chaque élément, j'ai créé un deuxième flux de travail qui est exécuté lorsqu'un nouvel élément de la bibliothèque est ajouté. Il peut également être exécuté manuellement (pour les éléments déjà dans la bibliothèque) et ce flux de travail. produit correctement l'URL nécessaire pour chaque élément.

Le problème:

Cette URL est plus longue que les 255 caractères acceptés par la colonne "Lien hypertexte ou image". Le flux de travail génère donc des erreurs lors de la tentative d'écriture de cette URL dans la colonne.

Ce que j'ai essayé:

J'y suis depuis un moment et j'ai trouvé plusieurs solutions de contournement publiées, dont aucune n'a fonctionné:

  • J'ai essayé de raccourcir l'URL en la rendant relative (afin que l'URL complètesite puisse être supprimée) et en la plaçant dans le champ "Lien hypertexte ou Image", mais cela a entraîné une erreur de flux de travail "URL non valide " même si l’URL produite fonctionne lorsque copié et collé dans la barre d’adresse
  • J'ai essayé de raccourcir l'URL en codant les parties statiques avec Bitly et cette fois, le flux de travail s'est terminé et a écrit une URL Cliquable pour le champ. Cependant, lorsque les parties statiques fonctionnent individuellement, lorsqu'ils sont concaténés avec les autres parties, l'URL finale mène à une erreur 404 sur le site Bitly.
  • J'ai créé une colonne "Calculée" dont le résultat est "Date/Heure" et Le calcul est une concaténation de parties de l'URL dans une syntaxe de lien hypertexte HTML (i.e. ="<a href='"&[column1]&[column2]&[column3]&"'>Click</a>"). Bien que cela ait réussi à obtenir que tout soit produit et placé dans la bibliothèque , Avec toutes les parties dynamiques correctes, le champ ne rend pasas le HTML analysé, à la place le balisage HTML complet est rendu, ce n'est donc pas un lien cliquable. (L'image ci-dessous montre une URL relative, mais avec cette approche, j'ai utilisé une URL absolue. L'image est uniquement destinée à montrer le résultat du balisage produit et non analysé.)

     enter image description here

  • J'ai essayé d'ajouter le champ "Contenu HTML complet avec mise en forme et contraintes Pour la publication" à ma bibliothèque (avec la fonctionnalité de site SharePoint Server Publishing Infrastructure activée) et le même balisage HTML .__ s'affichant comme avec la colonne calculée tentative ci-dessus.
  • J'ai essayé d'utiliser un champ de texte "multiligne" et j'ai obtenu le même balisage Comme ci-dessus.
  • Selon cet article , il n'y a pas de limite de longueur pour les URL Codées. J'ai donc essayé de coder l'intégralité de l'URL et de l'insérer dans un champ "Lien hypertexte ou image", mais les erreurs de flux de travail avec un message "URL invalide".

En résumé, je peux créer l'URL nécessaire, mais je ne peux pas trouver le moyen de le placer dans un champ pour chaque élément de manière à le rendre cliquable en tant que lien hypertexte. 


METTRE À JOUR:

En réponse à la suggestion de @ Lukáš Nešpor ci-dessous, j'ai essayé différentes variantes mais j'ai suivi vos instructions et essayé à nouveau. L'option de formatage de colonne ne figure pas dans la liste elle-même, mais cette option est disponible lors de la configuration de la colonne dans les paramètres de liste. C'est donc à cet endroit que j'ai entré le code JSON.

 enter image description here  enter image description here

Mais lorsque je l'essaie, la mise en forme JSON ne fonctionne pas.

 enter image description here

5
Scott Marcus

Nouvelle expérience utilisateur (en général)

Vous pouvez utiliser le formatage des colonnes . Il peut être utilisé dans les listes modernes pour modifier le rendu de la colonne (champ). Une utilisation possible est de rendre un lien avec les propriétés de l'élément en cours. Presque tous les champs peuvent être référencés, y compris ID, mais GUID malheureusement pas.

Pour résoudre le problème avec le champ GUID (sans code), vous pouvez créer une colonne de texte dans la liste et l'appeler, par exemple. Log Change Request. Créez ensuite un flux de travail simple et définissez cette colonne nouvellement créée sur le GUID de l'élément en cours. N'oubliez pas de configurer le flux de travail pour qu'il s'exécute lorsqu'un nouvel élément est créé.

 enter image description here

Ensuite, allez à la liste (en utilisant l’expérience moderne) et définissez le format de colonne.

 enter image description here

Le volet de droite s'ouvrira. Collez ci-dessous JSON dans le champ et enregistrez les modifications.

{
  "$schema": "https://developer.Microsoft.com/json-schemas/sp/column-formatting.schema.json",
  "elmType": "a",
  "txtContent": "Link",
  "attributes": {
    "href": {
      "operator": "+",
      "operands": [
        "https://company.sharepoint.com/sites/ABC/wfsvc/e73969f753574a3bb30c8d3ce3ab9c56/WFInitForm.aspx",
        "?List={f9b73015-1131-442d-95b8-9682149a27e6}",
        "&ID=",
        "[$ID]",
        "&ItemGuid=",
        "@currentField",
        "&TemplateID={64193686-AB59-4D44-B0EB-FBD8E2CB7A1F}",
        "&WF4=1",
        "&Source=https%3A%2F%2Fcompany%2Esharepoint%2Ecom%2Fsites%2FABC%2FCourseDocuments%2FForms%2FCourseDocuments%2Easpx%3FRootFolder%3D%252Fsites%252FDCU%252FCourseDocuments%252FBasic%2520Stuff%26FolderCTID%3D0x0120D52000E334520C326BA440BF6F86F3CA80AE2800E3DBD1BD3A1EA348A9D944A931464C4D"
      ]
    }
  }
}

Créez un élément et lorsque le flux de travail est terminé, la colonne doit contenir le lien dont vous avez besoin.


Expérience classique

Pour les vues classiques (héritées), vous pouvez utiliser Rendu du côté client . Il fait la même chose que le formatage de colonne dans une nouvelle expérience.

Créez une colonne de texte et appelez-la, par exemple. Log Change Request. La prochaine étape consiste à créer un fichier Javascript, à le télécharger sur SharePoint (un peu partout) et à enregistrer ce code en tant que JSLink dans la colonne.

1) Créez un fichier Javascript et appelez-le, par exemple. log-change-request.js 

// CSR-override for MDS enabled site
RegisterModuleInit("~site/SiteAssets/log-change-request.js", RegisterLink);

// CSR-override for MDS disabled site
RegisterLink(); 

function RegisterLink() {
  var field = {};
  field.Templates = {};
  field.Templates.Fields = {
    "LogChangeRequest": {
      "View": fieldTemplate
    }
  };

  SPClientTemplates.TemplateManager.RegisterTemplateOverrides(field);
}

function fieldTemplate(context) {
  var item = context.CurrentItem;
  return "<a href='"
    + "https://company.sharepoint.com/sites/ABC/wfsvc/e73969f753574a3bb30c8d3ce3ab9c56/WFInitForm.aspx"
    + "?List={f9b73015-1131-442d-95b8-9682149a27e6}"
    + "&ID=" + item.ID
    + "&ItemGuid=" + item.UniqueId
    + "&TemplateID={64193686-AB59-4D44-B0EB-FBD8E2CB7A1F}"
    + "&WF4=1"
    + "&Source=https%3A%2F%2Fcompany%2Esharepoint%2Ecom%2Fsites%2FABC%2FCourseDocuments%2FForms%2FCourseDocuments%2Easpx%3FRootFolder%3D%252Fsites%252FDCU%252FCourseDocuments%252FBasic%2520Stuff%26FolderCTID%3D0x0120D52000E334520C326BA440BF6F86F3CA80AE2800E3DBD1BD3A1EA348A9D944A931464C4D"
    + "'>"
    + "Link"
    + "</a>";
}

2) Téléchargez ce fichier sur les actifs du site vers la collection de sites dans laquelle vous avez créé la colonne Log Change Request. _ {Remarque: ce fichier peut être placé n'importe où vous devez simplement changer le chemin.} _
3) Téléchargez un SDK d'installation SharePoint Online Client Components . Il copiera certaines DLL nécessaires à la connexion à SharePoint à l'aide de PowerShell.
4) Exécutez le script PowerShell ci-dessous pour définir la propriété JSLink de la colonne sur le chemin du fichier Javascript. 

.NET CSOM solution comment définir la colonne

[System.Reflection.Assembly]::LoadWithPartialName("Microsoft.SharePoint.Client")
[System.Reflection.Assembly]::LoadWithPartialName("Microsoft.SharePoint.Client.Runtime")

function Set-JSLink() {
  Param(
    [string]$SiteUrl,
    [string]$ListTitle,
    [string]$ColumnTitle,
    [string]$JSLinkUrl
  )

  $creds = Get-Credential

  $ctx = New-Object Microsoft.SharePoint.Client.ClientContext($SiteUrl)
  $ctx.Credentials = New-Object Microsoft.SharePoint.Client.SharePointOnlineCredentials($creds.UserName, $creds.Password)

  $list = $ctx.Web.Lists.GetByTitle($ListTitle)
  $ctx.Load($list)
  $ctx.ExecuteQuery()

  $column = $list.Fields.GetByTitle($ColumnTitle)
  $column.JSLink = $JSLinkUrl
  # Make it read only so it is not visible in new or edit form
  $column.ReadOnlyField = $true
  $column.Update()

  $ctx.ExecuteQuery()
  $ctx.Dispose()
}

# Example:
Set-JSLink -SiteUrl "https://tenant.sharepoint.com/sites/ABC" -ListTitle "Document Sets" -ColumnTitle "Log Change Request" -JSLinkUrl "~site/SiteAssets/log-change-request.js"

Solution JSOM comment définir la colonne
L'utilisation de cette approche ne nécessite l'installation d'aucun SDK. Il suffit de placer ce code HTML dans l'éditeur de script.

<form>
  <input type="text" id="listTitle" placeholder="List title" /><br />
  <input type="text" id="columnTitle" placeholder="Column title" /><br />
  <input type="text" id="jsLink" placeholder="JSLink Url" /><br />
  <button onclick="setColumn(); return false;">Configure column</button>
</form>

<script type="text/javascript">
  'use strict';
  SP.SOD.executeFunc("sp.js")

  function setColumn() {
    var listTitle = document.getElementById("listTitle").value;
    var columnTitle = document.getElementById("columnTitle").value;
    var jsLink = document.getElementById("jsLink").value;

    var cc = new SP.ClientContext()
    var list = cc.get_web().get_lists().getByTitle(listTitle);
    cc.load(list);
    cc.executeQueryAsync(
      function () {
        var column = list.get_fields().getByTitle(columnTitle);
        column.set_jsLink(jsLink);
        column.set_readOnlyField(true);
        column.update();

        cc.executeQueryAsync(
          function () {
            alert("Column sucessfuly configured");
          },
          function (sender, args) {
            console.error(args.get_message());
          }
        );
      },
      function (sender, args) {
        console.error(args.get_message());
      }
    );

    cc.dispose();
  }

</script>

5) Ouvrez un ensemble de documents, ajoutez un document et la colonne devrait contenir le lien dont vous avez besoin.

Remarque:

Parce que la vue Ensemble de documents est uniquement une expérience classique, elle le fait peu importe ce qui est défini dans les paramètres (expérience nouvelle ou classique).

3
Lukas Nespor

Le champ Texte sur plusieurs lignes était censé être la solution pour l'exigence "URL longue".

Par défaut, le champ Texte multiligne ne traite que du texte brut, plutôt que du texte enrichi ou du texte enrichi amélioré. Si vous modifiez ce paramètre (si disponible), votre lien hypertexte sera rendu sous forme de lien hypertexte et vous ne serez pas soumis à la limite de 255 caractères qui s'applique aux colonnes de lien hypertexte. 

Dans Designer, vous pouvez accéder à Personnalisation -> Modifier les colonnes et modifier votre colonne de texte multiligne, puis cocher la case correspondant au texte enrichi ou au texte enrichi amélioré. 

Pour Sharepoint Online, vous sélectionnez la colonne dans les paramètres de liste ou de bibliothèque et définissez le bouton radio pour le texte enrichi ou le texte enrichi amélioré. 

Pour "Nouvelle expérience", il n'est pas possible de formater le texte en Rich Text. Vous pouvez toujours formater le texte en tant que Enhanced Rich Text, mais les balises HTML ne sont pas gérées (WTF ??). Bien entendu, vous pouvez rétablir une expérience classique dans une liste ou une bibliothèque du site global New Experience, ce qui vous redonnera Rich Text

MSFT a un élément de backlog pour ajouter la prise en charge multiligne multiligne pour le NE, mais depuis que je travaillais chez MSFT, je n'ai jamais rencontré de hiérarchisation raisonnable pour ce genre de petit écart désagréable.

 enter image description here

0
Craig.Feied

Deux choses que vous pouvez essayer:

  1. Le paramètre Source query string prend environ la moitié de votre URL. Si vous ne vous souciez pas de l'URL de retour, alors toute cette section peut probablement être supprimée en toute sécurité, ce qui entraînera l'adaptation de votre chaîne à la limite de 255 caractères du champ URL standard.
  2. Créez un champ de note avec le support HTML activé (lorsque vous le créez à partir de l'interface utilisateur, vous devez sélectionner l'option Texte enrichi amélioré (Texte enrichi avec images, tableaux et liens hypertexte) dans les paramètres de colonne supplémentaires), puis utiliser ce champ pour stocker votre balisage (l'élément HTML <a href="...">...</a>). S'il est correctement configuré, votre balisage sera correctement rendu dans la vue sous forme de liste et dans les formulaires d'élément de liste.

De plus, comme le lien peut être affiché à de nombreux endroits (vues de liste, composants Web de liste, formulaires d’éléments de liste, par exemple), évitez d’utiliser l’URL relative. Bien que l’URL ../wfsvc/[wf_id]/... puisse être correcte, par exemple, le contexte de incorrect dans le contexte du formulaire d'élément de liste. Utilisez plutôt des URL absolues ou des URL relatives du serveur Web (telles que /sites/yoursite/wfsvc/[wf_id]/...)

0
Szab