Requirement
Save more than one record (multiple records) to a SharePoint 2013 list in an App using the REST API in a single request (Batch Processing).
Solution
This can be done in one of the following ways:
- Traditional Approach: SharePoint REST API ($batch)
- Simplified Approach: SharePoint REST API + BreezeJs
Note: To explain both these approaches, I am using a SharePoint CustomList named "Employees" with the 3 columns "First Name", "Last Name" and "Email".
For both of these approaches SharePoint should receive the data as shown below.
Traditional Approach
SharePoint provides $batch processing that requires the following code snippet to generate the data shown in the preceding format. The following code is attached with this article as RESTAPI_Batch.js.
- var EmployeesAsJson = [
- {
- __metadata: {
- type: 'SP.Data.EmployeesListItem'
- },
- FirstName: 'User1',
- LastName: 'Test1',
- Email: '[email protected]'
- },
- {
- __metadata: {
- type: 'SP.Data.EmployeesListItem'
- },
- FirstName: 'User2',
- LastName: 'Test2',
- Email: '[email protected]'
- },
- {
- __metadata: {
- type: 'SP.Data.EmployeesListItem'
- },
- FirstName: 'User3',
- LastName: 'Test3',
- Email: '[email protected]'
- }
- ];
- var batchGuid = generateUUID();
-
-
- var batchContents = new Array();
- var changeSetId = generateUUID();
-
-
- var temp = document.createElement('a');
- temp.href = _spPageContextInfo.webAbsoluteUrl;
- var host = temp.hostname;
-
-
- for (var employeeIndex = 0; employeeIndex < employeesAsJson.length; employeeIndex++) {
-
- var employee = employeesAsJson[employeeIndex];
-
-
- var endpoint = _spPageContextInfo.webAbsoluteUrl
- + '/_api/web/lists/getbytitle(\'Employees\')'
- + '/items';
-
-
- batchContents.push('--changeset_' + changeSetId);
- batchContents.push('Content-Type: application/http');
- batchContents.push('Content-Transfer-Encoding: binary');
- batchContents.push('');
- batchContents.push('POST ' + endpoint + ' HTTP/1.1');
- batchContents.push('Content-Type: application/json;odata=verbose');
- batchContents.push('');
- batchContents.push(JSON.stringify(employee));
- batchContents.push('');
- }
-
- batchContents.push('--changeset_' + changeSetId + '--');
-
-
- var batchBody = batchContents.join('\r\n');
-
-
- var endpoint = _spPageContextInfo.webAbsoluteUrl
- + '/_api/$batch';
-
-
- var batchRequestHeader = {
- 'X-RequestDigest': jQuery("#__REQUESTDIGEST").val(),
- 'Content-Type': 'multipart/mixed; boundary="batch_' + batchGuid + '"'
- };
-
-
- jQuery.ajax({
- url: endpoint,
- type: 'POST',
- headers: batchRequestHeader,
- data: batchBody,
- success: function (response) {
- alert("Successfully saved a batch request");
- },
- fail: function (error) {
- alert('.. create employee FAIL ', error);
- }
- });
Simplified Approach
The code of the preceding content needs a lot amount of time and patience. As an alternate, Breezejs can be used to simplify the formatting and submission of data. We need to reference Breeze libraries in the SharePoint App Page. The following is the reference for that.
Here is the code format when using Breeze libraries. The following code is available with this article as RESTAPI_Breeze.js
-
- function createItem() {
-
- var Employee1 = entityManager.createEntity(EmployeeType);
- Employee1.FirstName = 'User1';
- Employee1.Title = 'Test1';
- Employee1.Email = '[email protected]';
-
- var Employee2 = entityManager.createEntity(EmployeeType);
- Employee2.FirstName = 'User2';
- Employee2.Title = 'Test2';
- Employee2.Email = '[email protected]';
-
- var Employee3 = entityManager.createEntity(EmployeeType);
- Employee3.FirstName = 'User3';
- Employee3.Title = 'Test3';
- Employee3.Email = '[email protected]';
-
-
- entityManager.saveChanges()
- .then(function () {
- alert("Successfully saved a batch request");
- });
- }
Future Articles
I will write new article(s) for the following content:
- Configuring Breeze to SharePoint 2013 App
- Example of Breeze along with code for create, update and delete operations.