DataTables logo
≡

fields.options

Since: Editor 1.4

List of options for fields which provide options to select from.
Please note - this property requires the Editor extension for DataTables.

Description

When working with field types which provide a list of options that the user can pick from, this parameter provides that ability to set the options available. The built-in field types which make use of this parameter are:

Plug-in field types may also make use of it. Please refer to the plug-in's documentation for details.

The fields.options parameter can be given either as an object, an array of values, or an array of objects.

Array of values

As an array of values, both the value and the label for the field will take the same value (i.e. what the user sees and what is submitted is the same). This is useful for static lists of options, but for data from a joined table, you would typically want to use a different value (i.e. a primary key) from the label.

Array of objects

To have a different value from the label you would typically use an array of objects. By default Editor will look for label and value properties inside the objects, but that can be controlled by the fields.optionsPair parameter.

Object

As an object, the value is taken from the object keys, and the label from the parameter's value.

Other data sources

Although this option makes it possible to set up the options for a field as part of the Editor initialisation (or addition of a field), you can also use the field().update() method to dynamically change the list of options that the user can pick from, or use the options parameter in the JSON uses to populate the DataTable (if you are using its ajax option). This JSON population of data provides the ability to easily get a list of options from a database. See the Editor client / server communication documentation for more details.

Type

This option can be given in the following type(s):

Examples

Array of values:

var editor = new DataTable.Editor({
	ajax: 'php/staff.php',
	table: '#myTable',
	fields: [
		{
			label: 'Title:',
			name: 'title',
			type: 'select',
			options: ['Mr', 'Ms', 'Mrs', 'Miss', 'Mx', 'Dr', 'Captain']
		}
	]
});

Array of objects:

var editor = new DataTable.Editor({
	ajax: 'php/staff.php',
	table: '#myTable',
	fields: [
		{
			label: 'Title:',
			name: 'title',
			type: 'select',
			options: [
				{ value: 1, label: 'Mr' },
				{ value: 2, label: 'Ms' },
				{ value: 3, label: 'Mrs' },
				{ value: 4, label: 'Miss' },
				{ value: 5, label: 'Mx' },
				{ value: 6, label: 'Dr' },
				{ value: 7, label: 'Captain' }
			]
		}
	]
});

Object:

var editor = new DataTable.Editor({
	ajax: 'php/staff.php',
	table: '#myTable',
	fields: [
		{
			label: 'Title:',
			name: 'title',
			type: 'select',
			options: {
				1: 'Mr',
				2: 'Ms',
				3: 'Mrs',
				4: 'Miss',
				5: 'Mx',
				6: 'Dr',
				7: 'Captain'
			}
		}
	]
});

Related

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

API
Options