Condividi tramite


SharePoint : Clicking the icon in Type column is highlighting the item instead of launching the document

Our customer has complained that in the old SharePoint they used to have, they could click on the document Icon, and this would open the document. In a new SharePoint, click makes a selection click in the list.

So the customer really wanted us to make this icons clickable.

I have found a number of solutions, and they all were not satisfactory for me.

Official Microsoft answer:

https://support.microsoft.com/en-us/kb/2457975

suggests to change the default xsl file on the server. WE have Office 365.

One of the most interesting solutions was here

https://spdociconlink.codeplex.com

(

you do not have to install the whole solution, as the core you can find in this file

https://spdociconlink.codeplex.com/SourceControl/latest#SPDocIconLink/SPDocIconLink/ControlTemplates/SPDocIconLink/SPDocIconLink.ascx

which just does a CSR override for the DocIcon field.

)

The disadvantages of this solution:

  1. Checkin/Checkout status is not shown. Usually there is a little override icon.
  2. When you have an OWA, the clicks on the documents does not open the editor, instead, the file is getting downloaded.

So I came with the solution that reuses the built-in functions, and so has all advantages of the proper icon and the opening of the OWA files.

function CustomIcon(ctx, field, listItem, listSchema) {
if (ctx.CurrentItem.FSObjType == '1') { /* a folder*/ 
var ret = [];
ret.push(ComputedFieldWorker.DocIcon(ctx, field, listItem, listSchema));
}
else {
var ret = [];
ret.push("<a href=\"" + ctx.CurrentItem.FileRef);
ret.push("\" onmousedown=\"return VerifyHref(this,event,'");
ret.push(listSchema.DefaultItemOpen);
ret.push("','");
ret.push(listItem["HTML_x0020_File_x0020_Type.File_x0020_Type.mapcon"]);
ret.push("','");
ret.push(listItem["serverurl.progid"]);
ret.push("')\" ");
ret.push(">");
ret.push(ComputedFieldWorker.DocIcon(ctx, field, listItem, listSchema));
ret.push("</a>");
}
return ret.join('');
}

(function () {
var overrideCtx = {};

overrideCtx.Templates = {};
overrideCtx.Templates.Fields = { 'DocIcon': { 'View': CustomIcon } };
SPClientTemplates.TemplateManager.RegisterTemplateOverrides(overrideCtx);
})();

Comments

  • Anonymous
    June 07, 2016
    Where do I have put this code?
    • Anonymous
      June 14, 2016
      well you can add it into the script that you attach by jslink to the list or view, in our case the customer wanted this to be on all sites and libraries so we have added this to the master. any way that makes the script appear on your page (up to script editor web part) should be ok.