ajax.dataSrc

Since: DataTables 1.10

Data property or manipulation method for table data.

Description

The ajax option basically inherits all of the options made available by jQuery.ajax, but we provide the extra option of dataSrc to provide the ability to alter what data DataTables will read from the JSON returned from the server, or to manipulate the data from one form into another (be it JSON to another form of JSON, XML, YAML etc). This is done because the success option of ajax should not be altered - DataTables uses it internally to execute the table draw when the data load is complete.

Types

`string`

As a string, dataSrc defines the property from the data source object (i.e. that returned by the Ajax request) to read.

Note that if your Ajax source simply returns an array of data to display, rather than an object, set this parameter to be an empty string.

Additionally you can use Javascript dotted object notation to get a data source for multiple levels of object / array nesting.

`object`

When provided as an object this parameter can be used to provide mapping between the response from a server and DataTables for it's server-side processing parameters. It is used for cases when the JSON response from the server is not in the format that DataTables expects.

There are four parameters which can be defined in the object:

data - Maps to where the value for the data array is.
draw - Maps to where the value is to use for the draw parameter.
recordsTotal - Maps to where the value for the recordsTotal parameter is.
recordsFiltered - Maps to where the value for the recordsFiltered parameter is.

Please refer to the server-side processing documentation for a full description of these parameters.

Each mapping value may be a string in Javascript dotted object notation or a function. If a function a single parameter is passed in, the JSON response from the server, and the return value should be the value for the parameter.

`ajax.dataSrc( data )`

As a function dataSrc provides the ability to manipulate the data returned from the server from one form into another. For example, if your data is split over multiple arrays you might combine it into a single array to return for processing and display by DataTables.

In this form dataSrc can be used to transform any data source, such as non-JSON data (XML, YAML, etc) into the Javascript array that DataTables expects.

Parameters:

	Name	Type	Optional
1	`data`	`object`	No
	Data returned from the server for the Ajax request

Returns:

array Array of data that DataTables is to use to draw the table

Default

data property of the data source object (or aaData if data is not present for backwards compatibility).

Examples

Get JSON data from a file via Ajax, using dataSrc to change data to tableData (i.e. { tableData: [ ...data... ] }):

$('#example').DataTable({
	ajax: {
		url: 'data.json',
		dataSrc: 'tableData'
	}
});

Get JSON data from a file via Ajax, using dataSrc to read data from a plain array rather than an array in an object:

$('#example').DataTable({
	ajax: {
		url: 'data.json',
		dataSrc: ''
	}
});

Manipulate the data returned from the server - add a link to data (note this can, should, be done using render for the column - this is just a simple example of how the data can be manipulated).:

$('#example').DataTable({
	ajax: {
		url: 'data.json',
		dataSrc: function (json) {
			for (var i = 0, ien = json.data.length; i < ien; i++) {
				json.data[i][0] =
					'<a href="/message/' + json.data[i][0] + '>View message</a>';
			}
			return json.data;
		}
	}
});

Map parameters to DataTables' expected server-side processing parameter names.:

$('#example').DataTable({
	ajax: {
		url: '/api/users',
		dataSrc: {
			data: 'results',
			draw: 'request',
			recordsTotal: 'total',
			recordsFiltered: 'filtered'
		}
	},
	serverSide: true
});

The following options are directly related and may also be useful in your application development.

API

Options

ajax.dataSrc

Description

Types

string

object

ajax.dataSrc( data )