SharepointPlus 3.14

Follow @sp_js

Description

SharepointPlus ($SP) is a JavaScript API for Sharepoint. This library offers some extended features for SharePoint entirely on client side (requires no server install). $SP will simplify your interactions with the Sharepoint Web Services and will help you to deal with the List Forms.

Other JavaScript library like this one are often complex, with few or no example. With SharepointPlus it's easy (like the SQL syntax) and you'll find examples for each method.

I've developed this API for my needs during my job at Dell and we thought it could be useful for the community too, so here it is !

Sharepoint Support

Sharepoint 2007 : SharepointPlus v3.0.4 is the last release that I have tested with Sharepoint 2007 -- after this version I cannot assure the retro-compatibility
Sharepoint 2010 : Compatible since SharepointPlus v3.0.4
Sharepoint 2013 : Compatible since SharepointPlus v3.13
Sharepoint Online : I have no plan to test SharepointPlus on Sharepoint Online, but it should be compatible.

Browser Support

IE8+, and all modern browsers (Firefox, Chrome, ....)

Quick Start

Requirements

Since v3.13, there is no more need of jQuery to work! For older versions, make sure to include jQuery.

The basics

Just add two lines: one to call either jQuery or nanoajax, and one for SharepointPlus:

// if you don't already use jQuery, then you need to call 'nanoajax':
<script type="text/javascript" src="nanoajax.min.js"></script>
<script type="text/javascript" src="sharepointplus-3.14.min.js"></script>

You may also want to use a CDN: SharepointPlus on JSDelivr

Lists

Sharepoint provides different Web Services that permits to do several tasks.

Let's see some examples of what you can do with SharepointPlus regarding the Lists interaction:

// Update all items with an "Amount" value bigger than 1000
$SP().list('My List Name').update({Title:"Too expensive"},{where:"Amount > 1000",success:function(items) { alert(items.length+" items updated!"); });

// Get all items with "Requestor" is the current user and with "Default Color" is "pink"
$SP().list('ListName').get({fields:"Title,Size",where:"Requestor = '[Me]' AND Default_x0020_Color = 'pink'",orderby:"Size DESC"},function(data) {
  var html = "<ul>";
  for (var i=data.length; i--;)
    html += "<li>Model '"+data[i].getAttribute("Title")+"' (size: "+data[i].getAttribute("Default_x0020_Color")+")<li>";
  $('#list').append(html+'</ul>');
});

Forms

SharepointPlus provides few functions to interact with NewForm.aspx and EditForm.aspx of a list:

// hide some fields like "Title", "Next Action"
$SP().formfields("Title,Next Action").row().hide(); // row() returns a jQuery object that represents the <TR> element

// check if all mandatory fields have a value, and also "Title"
$SP().formfields("Title",{mandatory:true}).each(function() {
  if (this.val() == "") {
    alert(this.name+" is empty!");
    return false;
  }
});

Utilities

SharepointPlus has also some useful functions:

// create a Excel file
var table="<table><tr><th>Column 1</th><th>Column 2</th></tr><tr><td>First cell</td><td>Other cell</td></tr></body>";
$SP().createFile({content:table,library:"Shared Documents",filename:"myfile.xls",after:function() { alert("File created!"); }});

// take a number and return it as a currency amount
$SP().toCurrency(1500000,2,'$'); // --> $1,500,000.00

// when you have to deal with a date from a .get() ...
$SP().list('My Calendar List').get({fields:"Meeting_x0020_Date"},function(data) {
  for (var i=data.length; i--;) console.log($SP().toDate(data[i].getAttribute("Meeting_x0020_Date")).getFullYear());
});
// ... or to a .add()/.update()
var nextMeeting = new Date("5/May/2015");
$SP().list('ListName').add({Title:"Next Meeting",Meeting_x0020_Date:$SP.toSPDate(nextMeeting)});

Promise

SharepointPlus is not yet Promise-compatible, however you can use, for example, jQuery.Deferred. Find below some examples:

// Call two lists in the same time before doing some stuff with the result
$.when(
  (function() {
    var deferred = jQuery.Deferred();
    $SP().list("List 1").get({fields:"Title,Other_x0020_Field", where:"Created = [Today]"}, function(data, err) {
      if (err) {
        deferred.reject(err);
      } else {
        deferred.resolve(data);
      }
    })
    return deferred;
  }()),
  (function() {
    var deferred = jQuery.Deferred();
    $SP().list("List 2").get({fields:"Title,Cost", where:"Cost > 100"}, function(data, err) {
      if (err) {
        deferred.reject(err);
      } else {
        deferred.resolve(data);
      }
    })
    return deferred;
  }())
).done(function(dataList1, dataList2) {
  // do some stuff here
}).fail(function(err) {
  alert("[ERROR] "+err)
})