Show attachments on SharePoint Discussion board Flat/Threaded views

As we all know, default OOB SharePoint Discussion Boards does not show attachments on Flat/Threaded views. If the user wants to view the attachments he had to click on "View Properties" and then view the attachments which is very inconvenient for the user. Moreover the attachment icon beside "View Properties" link is very small, hard to notice and is not linked to attachment. Due to this problem many of my business users were missing the attachments which are attached with the discussion. Due to this problem I had to find a way to show attachments within the Flat/Threaded views along with the content like this.

I started thinking for a way to implement it. Searched Google but couldn't find any solutions and finally one good idea flashed in my mind, i.e why shouldn't I try with jQuery I thought. Started looking into jQuery to implement it and finally here is the solution below.

<script type="text/javascript" src="../../Shared Documents/jquery-1.4.2.js"></script>
<script type="text/javascript">
//This script does not include attachments ICON's
$(document).ready(function(){
$('.ms-disc-padabove img[src*="attach.gif"]').each(function(index) {
var divAttachments;
var displayPageURL = $(this).parents().eq(2).next().find('a')[0].href;
displayPageURL += " #idAttachmentsTable";
if(index == 0)
{
divAttachments = "<br/><div id='divAttachments"+index+"'></div>";
$($($($(this).parents('.ms-disc-padabove')[0]).parent().next()[0]).find('div')[1]).append($(divAttachments));
}
else
{
divAttachments = "<br/><div id='divAttachments"+index+"'></div>";
$($($($(this).parents('.ms-disc-padabove')[0]).parent().next()[0]).find('div')[0]).append($(divAttachments));
}
$("#divAttachments"+index).load(displayPageURL);
});
});

//This script includes attachments ICON's
$(document).ready(function(){
//debugger;
//To display attachments
$('.ms-disc-padabove img[src*="attach.gif"]').each(function(index) {
var divAttachments;
var displayPageURL = $(this).parents().eq(2).next().find('a')[0].href;
if(index == 0)
{
divAttachments = "<br/><div id='divAttachments"+index+"'></div>";
$($($($(this).parents('.ms-disc-padabove')[0]).parent().next()[0]).find('div')[1]).append($(divAttachments));
}
else
{
divAttachments = "<br/><div id='divAttachments"+index+"'></div>";
$($($($(this).parents('.ms-disc-padabove')[0]).parent().next()[0]).find('div')[0]).append($(divAttachments));
}
//$($($($(this).parents('.ms-disc-padabove')[0]).parent().next()[0]).find('div > div')[0]).append($(divAttachments));
$.get(displayPageURL, function(data){
var attachmentsTable = $(data).find('#idAttachmentsTable');
$(attachmentsTable).find('a').each(function(index) {
var fileName = $(this)[0].innerHTML;
var fileExtension = fileName.substring(fileName.indexOf('.')+1).toLowerCase();
var imgTag;
if(fileExtension == 'xls' fileExtension == 'xlsx')
{
imgTag = "<IMG BORDER=0 ALT='"+fileName +"'title='" +fileName +"'SRC='/_layouts/images/icxls.gif'>&nbsp;"+fileName;
}
else if(fileExtension == 'doc' fileExtension == 'docx')
{
imgTag = "<IMG BORDER=0 ALT='"+fileName +"'title='" +fileName +"'SRC='/_layouts/images/icdoc.gif'>&nbsp;"+fileName;
}
else if(fileExtension == 'ppt' fileExtension == 'pptx')
{
imgTag = "<IMG BORDER=0 ALT='"+fileName +"'title='" +fileName +"'SRC='/_layouts/images/ICPPT'>&nbsp;"+fileName;
}
else if(fileExtension == 'txt')
{
imgTag = "<IMG BORDER=0 ALT='"+fileName +"'title='" +fileName +"'SRC='/_layouts/images/ictxt.gif'>"+fileName;
}
else if(fileExtension == 'bmp')
{
imgTag = "<IMG BORDER=0 ALT='"+fileName +"'title='" +fileName +"'SRC='/_layouts/images/ICBMP.gif'>&nbsp;"+fileName;
}
else if(fileExtension == 'jpeg')
{
imgTag = "<IMG BORDER=0 ALT='"+fileName +"'title='" +fileName +"'SRC='/_layouts/images/ICJPEG.gif'>&nbsp;"+fileName;
}
else if(fileExtension == 'jpg')
{
imgTag = "<IMG BORDER=0 ALT='"+fileName +"'title='" +fileName +"'SRC='/_layouts/images/ICJPG.gif'>"+fileName;
}
else if(fileExtension == 'png')
{
imgTag = "<IMG BORDER=0 ALT='"+fileName +"'title='" +fileName +"'SRC='/_layouts/images/ICPNG.gif'>"+fileName;
}
else
{
imgTag = "<IMG BORDER=0 ALT='"+fileName +"'title='" +fileName +"'SRC='/_layouts/images/ICGEN.gif'>&nbsp;"+fileName;
}
$(this)[0].innerHTML = imgTag;
});
$("#divAttachments"+index).append(attachmentsTable[0].outerHTML);
});
})
});
</script>

Add “Edit Item” link or remove “View Properties” link on SharePoint Discussion board Flat/Threaded views

One of my clients had a requirement to add "Edit Item" link on SharePoint Discussion Board Flat/Threaded View like this…

I had searched a lot on the Google to find an answer, but wasn't able to find one. Finally I had decided to dig through SharePoint file system and find how it works.

As we all know all the lists in SharePoint are features so I went in to this location "C:\Program Files\Common Files\Microsoft Shared\Web Server Extensions\12\TEMPLATE\FEATURES\DiscussionsList\Discuss" to open the schema.xml file for Discussion boards. I went through all the code but was not able to exactly find where this "View Properties" link is getting generated. After spending lot of time swimming through the code finally I got a code block which generates "View Properties" link. The code which generates "View Properties" is the field with the name "StatusBar" as shown below.

Now in the "StatusBar" you have something called "DisplayPattern" which contains the code for displaying "View Properties". So I have decided to add "Edit Item" link before "View Properties" link.

Below is the code to add "Edit Item" link before "View Properties"

I you want to remove "View Properties" link then simply comment the code highlighted in blue.

Note: Making Changes to the Schema file of Discussion Board will affect all the lists of type Discussion Board across the SharePoint farm. So I suggest to create a Custom Discussion Board list definition and implement in that.

You can also add "Edit Item" link like below, without modifying the SharePoint Custom Discussion Board list definition using jQuery Like this…

<script type="text/javascript" src="../../Shared Documents/jquery-1.4.2.js"></script>
<script type="text/javascript">
$(document).ready(function(){
//debugger;
//To display edit link after reply
$("a:contains('Reply')").each(function(index) {
//debugger;
var dispFormID = $(this).closest('td').siblings().find("a:contains('View Properties')")[0].search;
dispFormID = dispFormID.substring(0,(dispFormID.indexOf('&', 0)+1));
var itemID = dispFormID.substring((dispFormID.indexOf('=', 0)+1),(dispFormID.length)-1);
var parentID = "&amp;DiscussionParentID="+itemID;
var editformWithID = "EditForm.aspx"+dispFormID;
var editLink = $(this).closest('td')[0].outerHTML;
editLink = replaceAll(editLink,"reply.gif", "edititem.gif");
editLink = replaceAll(editLink,"Reply", "Edit");
editLink = ReplaceAll(editLink,"&amp;ContentTypeId=0x0107", "");
editLink = ReplaceAll(editLink,"NewForm.aspx?", editformWithID);
editLink = ReplaceAll(editLink,parentID, "");
editLink = "<td class=ms-separator><img src='/_layouts/images/blank.gif' alt=''></td>"+editLink;
$(this).closest('td').parent().append($(editLink));
});
});

function replaceAll(txt, replace, with_this)
{
return txt.replace(new RegExp(replace, 'g'),with_this);
}

function ReplaceAll(Source,stringToFind,stringToReplace)
{
var temp = Source;
var index = temp.indexOf(stringToFind);
while(index != -1){
temp = temp.replace(stringToFind,stringToReplace);
index = temp.indexOf(stringToFind);
}
return temp;
}
</script>