There are two ways of showing the attachments of List Item in the same grid where List Items will be shown.
Check the followings:
This TestList, each one contains multiple attachments.
Way 1: Using JavaScript-->
var my = my || {}; //my namespace
var context = SP.ClientContext.get_current();
var web = context.get_web();
var list = web.get_lists();
//Get List Name
var ListName = "TestList";
$(document).ready(function () {
my.ListItem = function(){
this.ID = ko.observable();
this.Title = ko.observable();
this.Attachments = ko.observableArray([]);
};
my.Attachment = function () {
this.AttachmentName = ko.observable();
this.AttachmentURL = ko.observable();
};
my.vm = function () {
//alert(1);
var
ListItems = ko.observableArray([]),
RetrieveItems = function(){
var targetList = list.getByTitle(ListName);
var camlQuery = new SP.CamlQuery();
camlQuery.set_viewXml('');
var itemColl = targetList.getItems(camlQuery);
context.load(itemColl);
context.executeQueryAsync(function(){
var listItemEnumerator = itemColl.getEnumerator();
while (listItemEnumerator.moveNext()) {
var oListItem = listItemEnumerator.get_current();
var tmpID = oListItem.get_item('ID');
var tmpTitle = oListItem.get_item('Title');
var item = new my.ListItem()
.ID(tmpID)
.Title(tmpTitle);
ListItems.push(item);
GetAttachemtns(tmpID,item);
}
}, RetrieveItemsFail)
},
GetAttachemtns = function(tmpID,tmpItem){
var targetList = list.getByTitle("TestList");
var targetListItem = targetList.getItemById(tmpID);
context.load(targetListItem);
context.load(targetListItem.get_attachmentFiles());
context.executeQueryAsync(function(){
var item = targetListItem;
var total = item.get_attachmentFiles().get_count();
for(var count = 0; count < total; count++) {
var spfile = item.get_attachmentFiles().get_item(count);
var fileName = spfile.get_fileName();
var serverRelativeUrl = spfile.get_serverRelativeUrl();
tmpItem.Attachments.push(new my.Attachment()
.AttachmentName(fileName)
.AttachmentURL(serverRelativeUrl));
}
},RetrieveItemsFail);
},
RetrieveItemsFail = function(){
alert('Failed to get list items. Error:' + args.get_message());
};
return {
ListItems: ListItems,
RetrieveItems: RetrieveItems
};
}();
my.vm.RetrieveItems();
ko.applyBindings(my.vm);
});
- Create a Site Page and add a Content Editor Web Part there and add the following code:
<script src="/<SiteURL>/_layouts/15/SP.Runtime.js" type="text/javascript"></script>
<script src="/<SiteURL>/_layouts/15/SP.js" type="text/javascript"></script>
<script src="/<SiteURL>/SiteAssets/Scripts/jquery-1.11.1.min.js" type="text/javascript"></script>
<script src="/<SiteURL>/SiteAssets/Scripts/knockout-3.0.0.js" type="text/javascript"></script>
<script src="/<SiteURL>/SiteAssets/Scripts/Script.js" type="text/javascript"></script>
<table border='1' data-bind="foreach: ListItems" >
<tr>
<td>
<table data-bind="foreach: Attachments" >
<tr>
<td><a data-bind="attr: { href: AttachmentURL },text : AttachmentName"></a></td>
</tr>
</table>
</td>
<td data-bind="text: ID"></td>
<td data-bind="text: Title"></td>
</tr>
</table>
- Save the Page the result will be shown as below:
Way 2: Using Server Side Code-->
using (SPSite site = new SPSite(SPContext.Current.Site.ID))
{
using (SPWeb web = site.OpenWeb(SPContext.Current.Web.ID))
{
SPList list = web.Lists["TestList"];
SPListItemCollection items = list.Items;
foreach (SPListItem item in items)
{
string s = "";
foreach (var atchmnt in item.Attachments)
{
string s1 = atchmnt.ToString();
}
}
}
}
I will suggest you to use JavaScript instead of Server Side Code. Best of Luck !!!
