Share via

SharePoint 2013: Delete list item Using JavaScript Object Model (JSOM)

  • Article

In this article, let's explain how to write code to perform basic operations using the JavaScript client object model in SharePoint 2013.

You can use the SharePoint client object model to retrieve, update and manage data in SharePoint 2013. SharePoint makes the object model available in several forms.

  • .NET Framework redistributable assemblies.
  • JavaScript library.
  • REST/OData endpoints.
  • Windows Phone assemblies.
  • Silverlight redistributable assemblies.

This article shows how to do basic operations using the JavaScript object model. You can add a reference to the object model using HTML <script> tags.

The following sections describe tasks that you can complete programmatically and they include JavaScript code examples that show the operations.

To delete a file, call the DeleteItem() function on the object. The following example uses the getFileByServerRelativeUrl method to retrieve the file from the Document Library and then deletes the item. 

Procedure

Open your SharePoint Site in SharePoint 2013 Designer, then select an Assets icon in the designer ribbon and add a JavaScript file.

After adding a JavaScript file, this file will be available in the SharePoint Site Assets Folder.

  • Go to the SharePoint site Page and add a new page to the SharePoint site.
  • After adding a page, select an Insert button in the Ribbon Menu.
  • Then add a Content Editor Web part into the page
  • Edit the WebPart and add a JavaScript file link to the content link.
  • Save the web part and save the page on the site. Click the button!

Source Code

< div  > < button  onclick = " DeleteItem ()" > Create the Item < /button></div > 
 
 < div  id = " output " > < /div> 
 
var siteUrl="http://gowtham.sharepointmasters.com";
 
<script type="text/javascript">
 
function deleteListItem() {
 
    this.itemId = 10;
 
    var ctx = new SP.ClientContext(siteUrl);
 
    var List = ctx.get_web().get_lists().getByTitle('Gowtham');
 
    this.ListItem = oList.getItemById(itemId);
 
    ListItem.deleteObject();
 
 
    clientContext.executeQueryAsync(
 
        Function.createDelegate(this, this.onQuerySucceeded),
 
        Function.createDelegate(this, this.onQueryFailed)
 
    );
 
}
 
 
function onQuerySucceeded() {
 
    alert('List Item deleted: ' + itemId);
 
}
 
 
function onQueryFailed(sender, args) {
 
    alert('Request failed. ' + args.get_message() +
 
        '\n' + args.get_stackTrace());
 
}
 
</script>

Thanks for reading.