In this document we will go through examples of using the Digital Workplace widget framework to build widgets using the Generic List Control (GLC) Customdataload callback type. The Customdataload callback type is a GLC callback that allows us to access the widget properties within the callback function. This allows us to customize how the GLC retrieves data, for example, retrieving data from multiple lists, lists on different sites, or even third party data.

Widgets that use Customdataload callbacks are instances of the Generic List Control Widget. We can create an instance by finding the GenericList Control within the Widget Manager and clicking its “View Instances” button. This will take us to the Manage Widget Instance View. Here we will click "+ Add Widget Instance". In the WidgetProperties Panel, find the callbacktype property. Type in customdataload. Click “Save & Exit”. This widget instance is now configured to use the customdataload callback.

Within the WidgetProperties Panel there is a property called dataloadproperties. Here we can define custom properties to pass to our customdataload callback. This is crucial in customizing the data retrieval of the callback. Custom properties and their respective values should be defined in the following fashion:

{'<PropertyName1>':'<Value>','<PropertyName2>':'<Value>',…,'<PropertyNameX>':'<Value>'}

When building a Customdataload callback our code will follow the form below:

function CustomDataLoadCallback(listRequest, def) {
    var me = this;	
    var context = new SP.ClientContext();

var dataProperties = JSON.parse(listRequest.dataLoadProperties.replace(/'/g, "\""));
var customParam = dataProperties.customparam;

//Retrieve any other necessary data

    context.executeQueryAsync(
		Function.createDelegate(me, function () { Successhandler(listRequest, def); }),
		Function.createDelegate(me, function (sender, args) { Errorhandler(listRequest, def); })
	);
	
}

function Successhandler(listRequest, def) {
	var result = {};

	//Add data to result properties
	//These properties will be bound to the template
	
	def.resolve({ response: result });
   
}

function Errorhandler(listRequest, def) {
	def.reject();
}

This is the callback form that the customdataload callback looks for.

The GLC properties can be accessed directly from this object.

This is the jquery deferred object. It is included with every customdataload callback. It is resolved or rejected based on the retrieval of data.

Here is where we retrieve our dataloadproperties value as an object.

Our customdataload callback requires us to fire a request that has a success and a fail case.

In our success handler we assign our data to appropriate Mustache Icons for our template. Think of this as where we would do the job of a standard GLC callback.

The object we will bind to the template

We resolve the deferred object, which sends the result object to be bound to the template.

In our error handler we will reject our deferred object and implement proper error handling

We reject our deferred object.

See the articles below for more on the Customdataload callback

• Hello World
• Accessing a List
• Accessing a List on a Different Site
• Third Party Data