Agregar campo con ícono del documento con Client-Side Rendering

Hace poco debía crear una vista utilizando CSR y me encontré en el conflicto de que no había una propiedad que me permitiera mostrar rápidamente el ícono del documento por lo cuál me dediqué a investigar y me encontré con un post de Ravi C Khambhati en el que muestra cómo habilitar el ícono para que sea posible descargar el documento (vea el artículo original aquí). Sin embargo, al seguir sus pasos para incluir la columna con el ícono con enlace de descarga me encontré con que si tenías una carpeta en la biblioteca, la misma no posee FileType y por ende, no se crea adecuadamente la url por lo cuál agregué una modificación al código quedando el mismo de la siguiente forma:

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

function DocIconBody(ctx) {
    var imgUrl;
    if(ctx.CurrentItem.File_x0020_Type.length == 0)
    {
        imgUrl = "/_layouts/15/images/skydrive_folder.png";
    }
    else
    {
        imgUrl = "/_layouts/15/images/ic" + ctx.CurrentItem.File_x0020_Type + ".png";
    }
    var ret = "<a href='" + ctx.CurrentItem.FileRef + "'>" +
                "<img title='" + ctx.CurrentItem.FileLeafRef + "' border='0' alt='" + ctx.CurrentItem.FileLeafRef + "' src='" + imgUrl + "' width='16' height='16' DragId='1' />" +
                "</a>";
    return ret;
}

En este caso particular escogí skydrive_folder.png porque fue la imagen que más me gustó, sin embargo, en la misma carpeta hay otras opciones. Espero que les sea de utilidad.

Deja un comentario