Monday 22 December 2014

Batch Operations using the JavaScript Client Object Model

To improve performance and to reduce the time taken for data to travel over the wire, we can do batch operations using the Client Object Model in SharePoint. This can really help in reducing load time of pages and make the user experience better. Batch operations can be done using the .NET as well as the JavaScript Client Object Model. In this post, we are going to focus on how to perform batch operations using the JavaScript Client Object Model. In each of the following operations, only one call from the client to server will be made. It will contain all the information needed to perform the necessary operation. So without further ado, here is the code:

1) Batch Add Items to List:


123456789101112131415161718192021222324252627282930
function createListItems() {
var itemArray = [];
var clientContext = SP.ClientContext.get_current();
var oList = clientContext.get_web().get_lists().getByTitle('TestList');
for(var i = 0; i< 5; i++){
var itemCreateInfo = new SP.ListItemCreationInformation();
var oListItem = oList.addItem(itemCreateInfo);
oListItem.set_item('Title', 'My New Item!' + i);
oListItem.update();
itemArray[i] = oListItem;
clientContext.load(itemArray[i]);
}
clientContext.executeQueryAsync(onQuerySucceeded, onQueryFailed);
}
 
function onQuerySucceeded() {
 
alert('Items created');
}
 
function onQueryFailed(sender, args) {
 
alert('Request failed. ' + args.get_message() + '\n' + args.get_stackTrace());
}
createListItems();
view rawbatchadd.js hosted with ❤ by GitHub


2) Batch Update Items from List:

1234567891011121314151617181920212223242526272829
function updateListItems() {
var itemArray = [];
var clientContext = SP.ClientContext.get_current();
var oList = clientContext.get_web().get_lists().getByTitle('TestList');
for(var i = 1; i<= 5; i++){
var oListItem = oList.getItemById(i);
oListItem.set_item('Title', 'My Updated Item!' + i);
oListItem.update();
itemArray[i] = oListItem;
clientContext.load(itemArray[i]);
}
clientContext.executeQueryAsync(onQuerySucceeded, onQueryFailed);
}
 
function onQuerySucceeded() {
 
alert('Items Updated');
}
 
function onQueryFailed(sender, args) {
 
alert('Request failed. ' + args.get_message() + '\n' + args.get_stackTrace());
}
updateListItems();
view rawbatchupdate.js hosted with ❤ by GitHub


3) Batch Delete Items from List:

12345678910111213141516171819202122232425
function deleteListItems() {
var clientContext = SP.ClientContext.get_current();
var oList = clientContext.get_web().get_lists().getByTitle('TestList');
for(var i = 0; i<= 5; i++){
var oListItem = oList.getItemById(i);
oListItem.deleteObject();
}
clientContext.executeQueryAsync(onQuerySucceeded, onQueryFailed);
}
 
function onQuerySucceeded() {
 
alert('Items Deleted');
}
 
function onQueryFailed(sender, args) {
 
alert('Request failed. ' + args.get_message() + '\n' + args.get_stackTrace());
}
deleteListItems();
view rawbatchdelete.js hosted with ❤ by GitHub
Now let us analyze what happens behind the scenes when we make one of these batch operations. Here is the firebug screen grab of the call to batch create 5 items:


Now as you can see, only one call is made from the client to the server. It contains all the XML necessary for creating the 5 items. Here is the relevant XML:
123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137
<Request xmlns="http://schemas.microsoft.com/sharepoint/clientquery/2009" SchemaVersion="15.0.0.0" LibraryVersion="16.0.0.0" ApplicationName="Javascript Library">
<Actions>
<ObjectPath Id="41" ObjectPathId="40"></ObjectPath>
<Method Name="SetFieldValue" Id="42" ObjectPathId="40">
<Parameters>
<Parameter Type="String">Title</Parameter>
<Parameter Type="String">My New Item!0</Parameter>
</Parameters>
</Method>
<Method Name="Update" Id="43" ObjectPathId="40"></Method>
<Query Id="44" ObjectPathId="40">
<Query SelectAllProperties="true">
<Properties>
<Property Name="FileSystemObjectType" ScalarProperty="true"></Property>
<Property Name="Id" ScalarProperty="true"></Property>
<Property Name="Title" ScalarProperty="true"></Property>
</Properties>
</Query>
</Query>
<ObjectPath Id="46" ObjectPathId="45"></ObjectPath>
<Method Name="SetFieldValue" Id="47" ObjectPathId="45">
<Parameters>
<Parameter Type="String">Title</Parameter>
<Parameter Type="String">My New Item!1</Parameter>
</Parameters>
</Method>
<Method Name="Update" Id="48" ObjectPathId="45"></Method>
<Query Id="49" ObjectPathId="45">
<Query SelectAllProperties="true">
<Properties>
<Property Name="FileSystemObjectType" ScalarProperty="true"></Property>
<Property Name="Id" ScalarProperty="true"></Property>
<Property Name="Title" ScalarProperty="true"></Property>
</Properties>
</Query>
</Query>
<ObjectPath Id="51" ObjectPathId="50"></ObjectPath>
<Method Name="SetFieldValue" Id="52" ObjectPathId="50">
<Parameters>
<Parameter Type="String">Title</Parameter>
<Parameter Type="String">My New Item!2</Parameter>
</Parameters>
</Method>
<Method Name="Update" Id="53" ObjectPathId="50"></Method>
<Query Id="54" ObjectPathId="50">
<Query SelectAllProperties="true">
<Properties>
<Property Name="FileSystemObjectType" ScalarProperty="true"></Property>
<Property Name="Id" ScalarProperty="true"></Property>
<Property Name="Title" ScalarProperty="true"></Property>
</Properties>
</Query>
</Query>
<ObjectPath Id="56" ObjectPathId="55"></ObjectPath>
<Method Name="SetFieldValue" Id="57" ObjectPathId="55">
<Parameters>
<Parameter Type="String">Title</Parameter>
<Parameter Type="String">My New Item!3</Parameter>
</Parameters>
</Method>
<Method Name="Update" Id="58" ObjectPathId="55"></Method>
<Query Id="59" ObjectPathId="55">
<Query SelectAllProperties="true">
<Properties>
<Property Name="FileSystemObjectType" ScalarProperty="true"></Property>
<Property Name="Id" ScalarProperty="true"></Property>
<Property Name="Title" ScalarProperty="true"></Property>
</Properties>
</Query>
</Query>
<ObjectPath Id="61" ObjectPathId="60"></ObjectPath>
<Method Name="SetFieldValue" Id="62" ObjectPathId="60">
<Parameters>
<Parameter Type="String">Title</Parameter>
<Parameter Type="String">My New Item!4</Parameter>
</Parameters>
</Method>
<Method Name="Update" Id="63" ObjectPathId="60"></Method>
<Query Id="64" ObjectPathId="60">
<Query SelectAllProperties="true">
<Properties>
<Property Name="FileSystemObjectType" ScalarProperty="true"></Property>
<Property Name="Id" ScalarProperty="true"></Property>
<Property Name="Title" ScalarProperty="true"></Property>
</Properties>
</Query>
</Query>
</Actions>
<ObjectPaths>
<Method Id="40" ParentId="6" Name="AddItem">
<Parameters>
<Parameter TypeId="{54cdbee5-0897-44ac-829f-411557fa11be}">
<Property Name="FolderUrl" Type="Null"></Property>
<Property Name="LeafName" Type="Null"></Property>
<Property Name="UnderlyingObjectType" Type="Number">0</Property>
</Parameter>
</Parameters>
</Method>
<Method Id="45" ParentId="6" Name="AddItem">
<Parameters>
<Parameter TypeId="{54cdbee5-0897-44ac-829f-411557fa11be}">
<Property Name="FolderUrl" Type="Null"></Property>
<Property Name="LeafName" Type="Null"></Property>
<Property Name="UnderlyingObjectType" Type="Number">0</Property>
</Parameter>
</Parameters>
</Method>
<Method Id="50" ParentId="6" Name="AddItem">
<Parameters>
<Parameter TypeId="{54cdbee5-0897-44ac-829f-411557fa11be}">
<Property Name="FolderUrl" Type="Null"></Property>
<Property Name="LeafName" Type="Null"></Property>
<Property Name="UnderlyingObjectType" Type="Number">0</Property>
</Parameter>
</Parameters>
</Method>
<Method Id="55" ParentId="6" Name="AddItem">
<Parameters>
<Parameter TypeId="{54cdbee5-0897-44ac-829f-411557fa11be}">
<Property Name="FolderUrl" Type="Null"></Property>
<Property Name="LeafName" Type="Null"></Property>
<Property Name="UnderlyingObjectType" Type="Number">0</Property>
</Parameter>
</Parameters>
</Method>
<Method Id="60" ParentId="6" Name="AddItem">
<Parameters>
<Parameter TypeId="{54cdbee5-0897-44ac-829f-411557fa11be}">
<Property Name="FolderUrl" Type="Null"></Property>
<Property Name="LeafName" Type="Null"></Property>
<Property Name="UnderlyingObjectType" Type="Number">0</Property>
</Parameter>
</Parameters>
</Method>
<Identity Id="6" Name="740c6a0b-85e2-48a0-a494-e0f1759d4aa7:site:5b2a524b-edc8-4da9-8904-4d28943abb39:web:26fc0fbf-d565-4c81-a9f5-ac858f67255a:list:a1e33484-c701-484e-8023-3ad360c23022"></Identity>
</ObjectPaths>
</Request>

No comments:

Post a Comment