Technical Treatment: Javascript

Recently we got a requirement to download the attachment files which are uploaded to a related records as Notes.
So, we created an HTML page which opens as a dialogue on click of a button. We need to retrieve the related annotations in HTML page or first retrieve them in button click javascript then pass them as a dialogue arguments. Then dynamically create an hyper links for each attachments in HTML, so that whenever user clicks that link, it should download the respective attachment file. Below is the code..!

<html>

<head>
    <meta charset="utf-8">
</head>
<body>
    <title></title>

    <script src="../../ClientGlobalContext.js.aspx" type="text/javascript"></script>
    <script src="../scripts/jquery.js" type="text/javascript"></script>
    <script src="../scripts/json2.js" type="text/javascript"></script>
    <script src="../scripts/XrmServiceToolkit.js" type="text/javascript"></script>

    <script type="text/javascript">
        $(document).ready(function () {

            // Retrieve notes (OR) pass notes details from the parent window as a Dialogue Arguments
            var notes = retrieveNotesFromCurrentRecord();
            //var notes = window.getDialogArguments();

                for (var j = 0; j < notes.length; j++) {
                    $('#tbl_files tr:last ').after("<tr><td class='d0'>"
                        + (j + 1) + "</td><td class='d1'></td><td class='d2'>"
                        + notes[j].CreatedOn + "</td></tr>");

                    var fileLink = $("<a id='" + notes[j].AnnotationId + "' href='#'>"
                        + notes[j].FileName + "</a>");
                    fileLink.click(function () { download(this.id); });
                    $('#tbl_files tr:last .d1').append(fileLink);
                }
        });

        function retrieveNotesFromCurrentRecord() {

            // To-do: Logic to retrieve notes from the current record
        }

        function download(annotId) {

            var urlbase = window.parent.Xrm.Page.context.getClientUrl();
            var URL = urlbase + '/userdefined/edit.aspx?etc=5&id={' + annotId + '}';
            var docUrl;

            $.get(URL, function (data) {
                data = $.parseHTML(data);
                var securityTokenElement = $(data).find("[WRPCTokenUrl]");
                if (securityTokenElement) {
                    var securityTokenUrl = securityTokenElement.attr("WRPCTokenUrl");

                    if (securityTokenUrl) {
                        docUrl = urlbase + "/Activities/Attachment/download.aspx?AttachmentType=5&AttachmentId={"
                            + annotId + "}&IsNotesTabAttachment=undefined" + securityTokenUrl;
                    }
                }

                var element = document.createElement('a');
                element.setAttribute('href', docUrl);
                element.style.display = 'none';
                document.body.appendChild(element);
                element.click();
                document.body.removeChild(element);
            });
        }
    </script>

    <header>
        <div class="title" id="divTitle">Attchment Files</div>
        <div class="description" id="divDescription">Please click on the link to download the attachment.</div>
    </header>
    <div class="main">
        <div>
            <table id="tbl_files">
                <th>Sl. No</th>
                <th>Uploaded File</th>
                <th>Uploaded On</th>
            </table>
        </div>
    </div>
</body>
</html>

Below is the Javascript code to fetch the query string parameter values from the URL.

function buttonClick() {

    var _QS = getQueryString();

    if (_QS['data'] == 'service') {
        // Service logic here
    }
    else if (_QS['data'] == 'sales') {
        // Sales logic here
    }
}

function getQueryString() {

    var _queryString = {};
    var _query = window.location.search.substring(1);
    
    // Split the parameters
    var _vars = _query.split("&");

    for (var i = 0; i < _vars.length; i++) {

        // Split the Name & Value pair
        var _pair = _vars[i].split("=");

        if (typeof _queryString[_pair[0]] === "undefined") {
            _queryString[_pair[0]] = _pair[1];

        } else if (typeof _queryString[_pair[0]] === "string") {
            var _array = [_queryString[_pair[0]], _pair[1]];
            _queryString[_pair[0]] = _array;

        } else {
            _queryString[_pair[0]].push(_pair[1]);
        }
    }

    return _queryString;
}

Technical Treatment

Saturday, November 5, 2016

Download Attachments in MSCRM using Javascript(HTML)

Tuesday, September 24, 2013

Retrieve query string parameter values in Javascript