After reading this article, you will learn how to Connect your ShortPoint elements to Document Libraries and map item properties including links behind Link items.



Prerequisites

  1. ShortPoint is already installed on your SharePoint Online (Office 365)  or on premise environment.
  2. Make sure you are ShortPoint Designer.


STEP 1: Add a ShortPoint Design Element Into Your Page


Edit your SharePoint page, place the cursor into the desired space on your page and open the ShortPoint Page Builder


Choose any design element, Simple List (we have selected for this article) from the list of design elements, click the Connect tab and select the REST API connection from the Select Connection Type drop down list.




STEP 2: Configure the REST API URL


Add the following URL in the REST API URL field:

https://<Site URL>/_api/web/lists/getbytitle('<Library Name>')/items?$select=LinkFilename,EncodedAbsUrl,<Other Filed Internal Names>,Author/Name&$expand=Author

 Make sure you replace the tags from the above URL with the appropriate values from your SharePoint Site:

  • <Site URL> - The full URL of you site or sub-site where your Document Library is located.
  • <Library Name> - The Name of your Library (e.g Documents).
  • <Other Fields Internal Names> - Make sure you add other fields from your Document Library which you wish to map into your design element. If you don't need other fields, just remove this tag.



STEP 3: Configure the Mapping Function


Click Enable Advanced Settings, scroll down to the Map Results function and add the following code into the text area:


var $ = shortpoint.$;
data.d.results.forEach(function (item) {
    if (item.LinkFilename.endsWith(".url")) {
        var shortcutUrlApi = shortpoint._spPageContextInfo.webAbsoluteUrl + "/_api/SP.Utilities.ShortcutLink.GetShortcutLink(@a1)?@a1=" + encodeURIComponent("'"+ shortpoint._spPageContextInfo.webAbsoluteUrl + "/<DOCUMENT LIBRARY URL>/" + item.LinkFilename + "'");
        $.ajax({
            url: shortcutUrlApi,
            type: "GET",
            async: false,
      success: function (response) {
             if(response.all[12].textContent) {
                item.EncodedAbsUrl = response.all[12].textContent;
             }
      },
      error: function(err){
                console.log(err);
            }
       });
    }
});
return data;

Make sure you replace the <DOCUMENT LIBRARY URL> with the URL of your Document Library. For example, for the default SharePoint Documents Library, the tag should be replaced with "Shared%20Documents".




STEP 4: Connect to the REST API


Scroll down and click Connect. If you run into any error during the connection, make sure you replaced properly the tags from the REST API URL and Map Results function.



STEP 5: Map the Items From Your Document Library Into Your View


After you successfully connected to the REST API, go to the Items tab, select the mappings of your fields and click Preview.



The URL of your Linked Items will be stored in a property called EncodedAbsUrl. Map this property on the Link field in order to open your Link Items (external Links) when you click on the items in view mode.

Also, if you have in you library both Link Items and Documents, the same property (EncodedAbsUrl) will store the URL for both item types.


STEP 6: Insert the Element on Your Page

Click Insert and check your newly added element. 




 Related: