In this article I would like to share the code to insert items into a host web list using JavaScript.
Use the following JavaScript code to insert an Item:

  1. var hostWebUrl;
  2. var appWebUrl;
  3. // This code runs when the DOM is ready and creates a context object which is needed to use the SharePoint object model
  4. $(document).ready(function ()
  5. {
  6. hostWebUrl = decodeURIComponent(manageQueryStringParameter('SPHostUrl'));
  7. appWebUrl = decodeURIComponent(manageQueryStringParameter('SPAppWebUrl'));
  8. //Insert method
  9. InsertItemToList();
  10. });
  12. //This function is used to get the hostweb url
  13. function manageQueryStringParameter(paramToRetrieve)
  14. {
  15. var params =
  16. document.URL.split("?")[1].split("&");
  17. var strParams = "";
  18. for (var i = 0; i < params.length; i = i + 1)
  19. {
  20. var singleParam = params[i].split("=");
  21. if (singleParam[0] == paramToRetrieve)
  22. {
  23. return singleParam[1];
  24. }
  25. }
  26. }
  29. //Insert List Item to SP host web
  30. function InsertItemToList()
  31. {
  32. var ctx = new SP.ClientContext(appWebUrl);//Get the SharePoint Context object based upon the URL
  33. var appCtxSite = new SP.AppContextSite(ctx, hostWebUrl);
  34. var web = appCtxSite.get_web(); //Get the Site
  35. var list = web.get_lists().getByTitle(listName); //Get the List based upon the Title
  36. var listCreationInformation = new SP.ListItemCreationInformation(); //Object for creating Item in the List
  37. var listItem = list.addItem(listCreationInformation);
  38. listItem.set_item("Title", "Title1");
  39. listItem.update(); //Update the List Item
  40. ctx.load(listItem);
  41. //Execute the batch Asynchronously
  42. ctx.executeQueryAsync(
  43. Function.createDelegate(this, success),
  44. Function.createDelegate(this, fail)
  45. );
  46. }
  48. function success()
  49. {
  50. alert("Item added successfully");
  51. }
  53. function fail(sender, args)
  54. {
  55. alert('Failed to get user name. Error:' + args.get_message());
  56. }
Note
In the AppManifest.xml file provide write permission to the SiteCollection.

Summary

This article explored how to insert list items into a host web list from a SharePoint Hosted app using JavaScript.