JSLink Archives : Binary Bits

Display attachments using JSLink in SharePoint

Kannan — Tue, 30 May 2017 10:20:58 +0000

Recently I had a requirement where the customer wanted to show the actual attachment’s URL in the list view instead of default Icon. Following JSLink code will help to do that.

(function () {
    var linkFiledContext = {};
    linkFiledContext.Templates = {};
    linkFiledContext.Templates.Fields = {
        "Attachments": { "View": OverrideAttachmentFieldRendering }
    };
    SPClientTemplates.TemplateManager.RegisterTemplateOverrides(linkFiledContext);
})();

function OverrideAttachmentFieldRendering(ctx) {
    var itemId = ctx.CurrentItem.ID;
    var listName = ctx.ListTitle;
    return GetAttachments(listName, itemId);
}

function GetAttachments(listName, itemId) {
    var url = _spPageContextInfo.webAbsoluteUrl;
    var requestUri = url + "/_api/web/lists/getbytitle('" + listName + "')/items(" + itemId + ")/AttachmentFiles";
    var htmlString = "No attachment(s)";

    $.ajax({
        url: requestUri,
        type: "GET",
        headers: { "ACCEPT": "application/json;odata=verbose" },
        async: false,
        success: function (data) {
            for (var i = 0; i < data.d.results.length; i++) {
                htmlString += "" + data.d.results[i].FileName + "";
                if (i != data.d.results.length - 1) {
                    htmlString += "
";
                }
            }
        },
        error: function (error) {
            console.log("An error occured while fetching attachment details. Details: " + JSON.stringify(error))
        }
    });

    return htmlString;
}

Source: https://social.msdn.microsoft.com/Forums/office/en-US/29f7998f-ffc5-4877-b975-a49631b53ba2/show-attachments-with-jslink?forum=sharepointdevelopment

The post Display attachments using JSLink in SharePoint appeared first on Binary Bits.

Change SharePoint’s “there are no items to show in this view” message

Kannan — Thu, 25 May 2017 10:06:45 +0000

When a list has not data to be shown in the view, we see the following message.

There are no items to show in this view of the “” list.

The following JSLink script helps to change this message.

(function () {
    var overrideCurrentContext = {};
    overrideCurrentContext.Templates = {};
    overrideCurrentContext.Templates.OnPreRender = changeNoListItemMessage; //OR overrideCurrentContext.OnPreRender = changeNoListItemMessage;
    SPClientTemplates.TemplateManager.RegisterTemplateOverrides(overrideCurrentContext);
})();

function changeNoListItemMessage(ctx) {
    ctx.ListSchema.NoListItem = "No data";
}

Source: http://www.idubbs.com/blog/2015/jslink-csr-to-override-there-are-no-items-to-show-in-this-view/

The post Change SharePoint’s “there are no items to show in this view” message appeared first on Binary Bits.

Displaying SharePoint user presence indicator in CSR

Kannan — Tue, 23 May 2017 09:15:32 +0000

The following are code snippets which can be used to show a user’s Lync/Skype for Business presence status in SharePoint Client Side Rendering (CSR).

Default Render

With Picture Detail View

With Picture

Presence Only

Picture Only

Source: http://www.sharepointcolumn.com/lync-presence-indicators-code-snippets-in-sharepoint-2013/

The post Displaying SharePoint user presence indicator in CSR appeared first on Binary Bits.

JSLink URL Tokens in SharePoint

Kannan — Wed, 17 May 2017 03:54:15 +0000

Following are some of the JSLink URL Tokens I have come across in SharePoint.

~site – reference to the current SharePoint site (or “Web”)
~sitecollection – reference to the current SharePoint site collection (or “Site”)
~layouts – version specific reference to the web application Layouts folder (so it will automatically swap out /_layouts/14 or /_layouts/15 for you)
~sitecollectionlayouts – reference to the layouts folder in the current site collection (e.g. /sites/team/_layouts/15)
~sitelayouts – reference to the layouts folder in the current site (e.g. /sites/teams/subsite/_layouts/15)

Few Examples:

~sitecollection/_catalogs/masterpage/
~site/siteassets/
~layouts/reputation.js

Source: https://www.martinhatch.com/2013/08/jslink-and-display-templates-part-1.html

The post JSLink URL Tokens in SharePoint appeared first on Binary Bits.

Load multiple JavaScript files in SharePoint JSLink

Kannan — Mon, 15 May 2017 11:07:27 +0000

To load multiple JavaScript files in SharePoint JSLink, insert a pipe symbol between multiple JavaScript file links in the JSLink field of webpart’s properties.

JSLink Field Example:

~sitecollection/SiteAssets/jquery.min.js|~site/SiteAssets/my-custom-file.js

A piple symbo is a “|” without quotes

Source: https://egilhansen.com/2013/03/11/jslink-the-simple-way-to-add-and-load-multiple-javascript-files/

The post Load multiple JavaScript files in SharePoint JSLink appeared first on Binary Bits.