Get List Item attachments using ECMA Script

Hi All,

In a following post , we will see how to read Attachments from List by using ECMA Script.

Below Method BindAttachments() is used to bind attachment to the table.

In my Page I have defined table as follows,

<table>

          <tbody id="att_row_div">

          </tbody>

</table>

I am passing listItem,web,context objects to the Method.

function BindAttachments(listItem, web, context) {

    var attachmentFolder = web.getFolderByServerRelativeUrl('Lists/ListName/Attachments/' + listItem.get_id());

    var attachmentFiles = attachmentFolder.get_files();

    context.load(attachmentFiles);

    context.executeQueryAsync(onQuerySuccess, onQueryFailed);

    function onQuerySuccess() {

        var listEnumerator = attachmentFiles.getEnumerator();

        var count = listEnumerator.$2K_0;

        if (count > 0) {

            for (var i = 0; i < count; i++) {

                var attachUrl = SPHostUrl + "/Lists/ListName/Attachments/" + listItem.get_id() + "/" + attachmentFiles.itemAt(i).get_name();

                var contentID = document.getElementById('att_row_div');

                var newtr = document.createElement('tr');

                newtr.setAttribute('id', 'AttachmentstrText' + i);

                newtr.innerHTML = "<td> <a href='" + attachUrl + "'>Add</a></td>";

                contentID.appendChild(newtr);

            }

        }

        //   We Can Use below Method also to get the Attachment attachmentFiles.itemAt(i).get_serverRelativeUrl();

    }

    function onQueryFailed(sender, args) {

        alert('Request failed. ' + args.get_message() +

              '\n' + args.get_stackTrace());

    }

}

We can read attachments by using below way also,

function BindAttachments(listItem, web, context) {

    var Attachments = listItem.get_attachmentFiles();

    context.load(Attachments);

    context.executeQueryAsync(onQuerySuccess, onQueryFailed);

    function onQuerySuccess() {

        var AttachmentsEnum = Attachments.getEnumerator();

        var count = 0;

        while (AttachmentsEnum.moveNext()) {

            count = count + 1;

            var listFileItem = AttachmentsEnum.get_current();

            var fileName = listFileItem.get_fileName();

            var attachUrl = SPHostUrl + "/Lists/ListName/Attachments/" + listItem.get_id() + "/" + fileName;

            var contentID = document.getElementById('att_row_div');

            var newtr = document.createElement('tr');

            newtr.setAttribute('id', 'AttachmentstrText' + count);

            newtr.innerHTML = "<td> <a href='" + attachUrl + "'>" + fileName + "</a></td>";

            contentID.appendChild(newtr);

        }

    }

    function onQueryFailed(sender, args) {

        alert('Request failed. ' + args.get_message() +

              '\n' + args.get_stackTrace());

    }

}

Thanks.

Related Post