In MS CRM you can attach different types of documents
to notes. There are some file extensions of attachments are blocked by default
by CRM, also you can add / remove file extensions from blocked list.
You will find blocked
extensions for attachment in Settings à Administration à System Settings.
In MS CRM you can attach one attachment per note, and
to view attachment you have to download it, then only you can able to view.
Also to view attachments for particular record, we need
to open each note and download individual.
To view all attachments of single record in single
page, I create one solution with HTML web resource, which will give option to
view (extensions restricted) attachments or download attachment from single
page.
To create this solution I used one HTML web resource.
Steps to create view Attachment Page.
1.
To show button on records form
a.
Create one Ribbon button “View Attachment”
using ribbon workbench.
b.
In Button command Add Action – JavaScript Command.
c.
In JavaScript command call function – OpenViewAttachment
d.
If want you can add Display Rules or Enable
Rules, for when to show this button.
2.
JavaScript library - new_js/contactScript.js
contactScript =
{
OpenViewAttachment: function () {
// get current Record Id
var recordId =
Xrm.Page.data.entity.getId();
var customParam =
encodeURIComponent("recordId=" + recordId);
//pass current
record Id to Web resource, to retrieve all attachments from note.
Xrm.Utility.openWebResource("new_HTML/AttachmentViewer.html", customParam);
},
}
1.
HTML Web resource
a.
In HTML web resource add script reference
for jquery_1.10.2.js, Jquery_ui_1.10.4.min.js and ClientGlobalContext.js.aspx
b.
In Web resource, calling two functions when
document is ready
i.
getDataParam()
This function is used to get query
string parameter (recordId) which we passed from OpenViewAttachment function, when opening HTML web
resource.
ii.
GetCurrentRecordAttachments()
This
function will retrieve all notes with attachment, and show list of notes &
attachment.
Here is complete code of
HTML web resource
<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta charset="utf-8" />
<title></title>
<script src="../ClientGlobalContext.js.aspx" type="text/javascript"></script>
<script src="../new_js/jquery_1.10.2.js" type="text/javascript"></script>
<script src="../new_js/Jquery_ui_1.10.4.min.js" type="text/javascript"></script>
<style>
.fixed_headers {
width: 100%;
table-layout: fixed;
/*border-collapse:
collapse;*/
border: thin solid #b3b3b3;
}
.fixed_headers th {
text-decoration: underline;
}
.fixed_headers th,
.fixed_headers td {
padding: 5px;
text-align: left;
}
.fixed_headers td:nth-child(1),
.fixed_headers th:nth-child(1) {
min-width: 5%;
}
.fixed_headers td:nth-child(2),
.fixed_headers th:nth-child(2) {
min-width: 25%;
}
.fixed_headers td:nth-child(3),
.fixed_headers th:nth-child(3) {
width: 10%;
}
.fixed_headers td:nth-child(4),
.fixed_headers th:nth-child(4) {
width: 10%;
}
.fixed_headers td:nth-child(5),
.fixed_headers th:nth-child(5) {
width: 25%;
}
.fixed_headers td:nth-child(6),
.fixed_headers th:nth-child(6) {
width: 25%;
}
.fixed_headers thead {
background-color: #b3ccff;
color: #fdfdfd;
}
.fixed_headers thead tr {
display: block;
position: relative;
}
.fixed_headers tbody {
display: block;
overflow: auto;
width: 100%;
height: 200px;
}
.fixed_headers tbody tr:nth-child(even) {
background-color: #cce5ff;
}
.old_ie_wrapper {
height: 200px;
width: 100%;
overflow-x: hidden;
overflow-y: auto;
}
.old_ie_wrapper tbody {
height: auto;
}
</style>
<script type="text/javascript">
var recordId;
$(document).ready(function () {
getDataParam();
GetCurrentRecordAttachments();
});
function getDataParam() {
var vals = new Array();
if (location.search != "") {
vals =
location.search.substr(1).split("&");
for (var i in vals) {
vals[i] = vals[i].replace(/\+/g, " ").split("=");
}
//look for the
parameter named 'data'
var found = false;
for (var i in vals) {
if (vals[i][0].toLowerCase() == "data") {
parseDataValue(vals[i][1]);
break;
}
}
}
else {
noParams();
}
}
function noParams() {
alert('No data parameter was passed to this page.');
}
function parseDataValue(datavalue) {
if (datavalue != "") {
var vals = new Array();
vals =
decodeURIComponent(datavalue).split("&");
for (var i in vals) {
vals[i] = vals[i].replace(/\+/g, " ").split("=");
if (vals[i][0].toLowerCase() == "recordid") {
recordId = vals[i][1];
recordId =
recordId.replace('{', '');
recordId =
recordId.replace('}', '');
break;
}
}
}
}
function GetCurrentRecordAttachments() {
var container = $('#my-container'),
table = $('< table class="fixed_headers" >');
var thead = $('< thead >');
var theadTr = $('< tr >');
theadTr.append('< th > Subject</ th >');
theadTr.append('< th > File Name</ th >');
theadTr.append('< th > File Type</ th >');
theadTr.append('< th > View / Download< /th >');
thead.append(theadTr);
table.append(thead);
var viewInBrowser = ["image/png", "text/plain", "application/pdf", "image/jpg", "image/bmp"];
var req = new XMLHttpRequest();
req.open("GET", Xrm.Page.context.getClientUrl() + "/api/data/v8.0/annotations?$select=annotationid,documentbody,filename,mimetype,subject&$filter=_objectid_value
eq " + recordId + " and isdocument eq true", true);
req.setRequestHeader("OData-MaxVersion", "4.0");
req.setRequestHeader("OData-Version", "4.0");
req.setRequestHeader("Accept", "application/json");
req.setRequestHeader("Content-Type", "application/json; charset=utf-8");
req.setRequestHeader("Prefer", "odata.include-annotations=\"OData.Community.Display.V1.FormattedValue\"");
req.onreadystatechange = function () {
if (this.readyState === 4) {
req.onreadystatechange = null;
if (this.status === 200) {
var results = JSON.parse(this.response);
for (var i = 0; i < results.value.length; i++) {
var annotationid = results.value[i]["annotationid"];
var documentbody = results.value[i]["documentbody"];
var filename = results.value[i]["filename"];
var mimetype = results.value[i]["mimetype"];
var subject = results.value[i]["subject"];
var tr = $('< tr >');
tr.append('< td >' + subject + '< /td >');
tr.append('< td >' + filename + '< /td >');
var url = "data:" + mimetype + ";base64," + documentbody;
var id = "h" + i;
tr.append('< td >' + mimetype + ' < input id="' + id + '" type="hidden" value="' + url + '" /> < /td >');
var Isview = false;
for (var j = 0; j < viewInBrowser.length; j++) {
if (viewInBrowser[j] == mimetype) {
Isview = true;
break;
}
}
if (Isview) {
var alink = "< a id ='" + id + "' href='#'
onclick='showData(this);' > View </ a >";
tr.append('< td >' + alink + '</ td >');
}
else {
var alink = "< a id ='" + id + "' href='#'
onclick='showData(this);'> Download </ a >";
tr.append('< td >' + alink + '</ td>');
}
table.append(tr);
}
}
else {
alert(this.statusText);
}
}
};
container.append(table);
req.send();
}
function showData(ctrl) {
var id = ctrl.id;
var url = $('#' + id).val();
document.getElementById("itempreview").src = url;
}
</script>
</head>
<body>
<div id="my-container">
</div>
<br />
<span style="font-weight: 700"> View Attachment</span>
<div>
<br />
<iframe id="itempreview" style="height: 600px; width: 800px"></iframe>
</div>
</body>
</html>
With this HTML web resource, we can view attachments
which are images, PDF or text, if attachments are word document, excel, PowerPoint
etc., and then need to download.
Hope this will help..