Delete a File in a Document Library in SharePoint 2013 Using CSOM-JavaScript

Introduction

This article explains how to delete a file in a Document Library in SharePoint 2013 using CSOM-JavaScript.

Prerequisites

1. Ensure you have access to the Office 365 online.
2. Ensure the Napa tool is available in your site.

Use the following procedure

1. Create an app for SharePoint using Office 365 Tools. If you have missed out on how to create an app in SharePoint 2013, then Click here
2. Create a Docment Library and name it “MyDocumentLibrary”. Refer to my article if you want to know how to create a Document Library in SP2013.Click Here
3. Create a file named “MyTextFile”. Click here if you want to know how to create a file in a Document Library.
4. Click on the Default.aspx page.
   
   
   
   
5. Click on App.js file.
   
   
   
   
6. Globally declare the content and web objects as shown below.
    

   var context = SP.ClientContext.get_current();//gets the current context

   var web = context.get_web(); //gets the web object
    

7. Now write the following function to read a file in a Document Library.
    

   function deleteFile() {

           context.load(web);

           context.executeQueryAsync(onDeleteGetFileUrl, onDeleteFileFailure);

       }

       function onDeleteGetFileUrl() {

           var fileUrl = web.get_serverRelativeUrl() + "/MyDocumentLibrary/MyTextFile.txt";

           var fileToDelete = web.getFileByServerRelativeUrl(fileUrl);

           fileToDelete.deleteObject();

           context.executeQueryAsync(onDeleteFileSuccess, onDeleteFileFailure);

       }
    

8. Here in this example we are deleting a file in a Document Library.
9. getFileByServerRelativeUrl is a method to get the file from the directory and then delete the item.
10. Then call the executeQueryAsync method.
     

    function onDeleteFileSuccess() {

            alert("File got deleted");

        }

        function onDeleteFileFailure(sender, args) {

            debugger;

            alert('Failed to delete a file. Error:' + args.get_message());

        }
     

11. That's it!! Now let's start testing.

Testing

1. Now to run the app click on the "Play" button available towards the left-most corner.
   
   
   
   
2. The app is packaged, deployed, and installed on your Office 365 Site.
   
   
   
   
3. Now you will be able to see the following page.
   
   
   
   
4. Before clicking on the Delete File button let's navigate to the following URL and check whether the file exists in the Document Library.
   
   Syntax: https://yoursite/DocumentLibraryName
   Example:https://mysite/MyDocumentLibrary
   
   
    
5. Now let's go and click the delete file button.
6. Now navigate to the Document Library; you will not be able to see the “MyTextFile”.

Summary

Thus in this article you saw how to delete a file in a Document Library in SharePoint 2013 using CSOM-JavaScript.