[Forum FAQ] Show Attachments in SharePoint 2013 Custom List View

              

SharePoint 2013 - General Discussions and Questions        

• Remove From My Forums

Welcome to the SharePoint 2013 General Discussions and Questions forum. Use this forum to discuss general topics for the RTM release version of SharePoint 2013. If you have SharePoint 2013 Preview version questions, you can still ask about Preview for a limited time: http://social.technet.microsoft.com/Forums/en-US/sharepointitpropreview and http://social.msdn.microsoft.com/Forums/en-US/sharepointdevpreview. General questions about SharePoint 2010  can be answered here: http://social.technet.microsoft.com/Forums/en-US/sharepointgeneralprevious and for previous versions here: http://social.technet.microsoft.com/Forums/en-US/sharepointgenerallegacy

Announcements: 0

                      

• Introduction:

  By default, there is an Attachments column in the SharePoint List, some people want to display attachments name and click name can open the documents in List View. In this article, we would show you the method withREST API, JSLink and jQuery.

  Solution:

  The steps in detail as follows:

  1.       Download the jQuery API  and upload the js file into theSiteAssets Document Library.
  2.       Save the following code as a js file (showAttachments.js) and upload it into theSiteAssets Document Library.

  (function () {    // Create object that have the context information about the field that we want to change it output render      var attachmentsFiledContext = {};    attachmentsFiledContext.Templates = {};    attachmentsFiledContext.Templates.Fields = {                 "Attachments": { "View": AttachmentsFiledTemplate }    };    SPClientTemplates.TemplateManager.RegisterTemplateOverrides(attachmentsFiledContext);})();// This function provides the rendering logic for list view function AttachmentsFiledTemplate(ctx) {    var itemId = ctx.CurrentItem.ID;    var listName = ctx.ListTitle;           return getAttachments(listName, itemId);}//get attachments field propertiesfunction getAttachments(listName,itemId) {      var url = _spPageContextInfo.webAbsoluteUrl;    var requestUri = url + "/_api/web/lists/getbytitle('" + listName + "')/items(" + itemId + ")/AttachmentFiles";    var str = "";    // execute AJAX request    $.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++) {                str += "<a href='" + data.d.results[i].ServerRelativeUrl + "'>" + data.d.results[i].FileName + "</a>";                if (i != data.d.results.length - 1) {                    str += "<br/>";                }                            }                  },        error: function (err) {            //alert(err);        }    });    return str;}

  
  

  3.     Edit the list view page.

  4.Edit the list web part. Go to Miscellaneous -> JS Link.

  5.    Add the following URL into the JS Link textbox.

  ~site/SiteAssets/jquery-1.11.1.min.js|~site/SiteAssets/showAttachments.js

  

  Result:<o:p></o:p>

  

  ---

  Please click to vote if the post helps you. This can be beneficial to other community members reading the thread.