Select2

Use the Select2 library with Editor for complex select input options.

• Requires: Select2

Select2 is a replacement for HTML select elements, enhancing standard select's with searching, remote data sets and more. This plug-in provides the ability to use Select2 with Editor very easily.

Note for when using Select2's remote Ajax data source option: In order to have the label correctly render for an item being edited, the server-side script that is responding to the Select2 requests must be able to accept a request with the parameters: initialValue:true and value:... (i.e. the value). The server must respond with { "id": value, "text": "Label to show" }.

Plug-in configuration and API

Options

This field type supports the following options, in addition to the default field-options configuration:

• object options: - The values and labels to be used in the Select2 list. This can be given in a number of different forms:
  • object - Name / value pairs, where the property name is used as the label and the value as the field value. For example: { "Edinburgh": 51, "London": 76, ... }.
  • array - An array of objects with the properties label and value defined. For example: [ { label: "Edinburgh", value: 51 }, { label: "London", value: 76 } ].
  • array - An array of values (e.g. numbers, strings etc). Each element in the array will be used for both the label and the value. For example: [ "Edinburgh", "London" ].
• object optionsPair: If options is given as an array of objects, by default Editor will read the information for the label and value properties of the select input from the label and value properties of the data source object. This option provides the ability to alter those parameters by giving it as an object containing the properties label andvalueitself, the values of which indicate the properties that should be read from the data source object. For example you might use{ label: 'name', value: 'id' }`.
• object opts: Select2 initialisation options object. Please refer to the Select2 documentation for the full range of options available.
• object attr: Attributes that are applied to the select element before Select2 is initialised
• string - separator when the multiple and tags options are used for Select2 (opts parameter) this can be used to use a string value to represent the multiple values that are selected. The character given for this parameter is the separator character that will be used.
• string - onFocus: Action to take when the Select2 field is focused. This can be open or undefined. If open the dropdown list will automatically show when the field is focused.

Methods

This field type supports the following methods, in addition to the default field() methods:

• inst: Execute a Select2 method, using the arguments given. The return value is that returned by the Select2 method. For example you could use editor.field('priority').inst('val') to get the value from Select2 directly.
• update: Update the list of options that are available in the Select2 list. This uses the same format as options for the initialisation.

License required

The Editor plug-ins are available to download for licensed users of Editor only. If you already have an Editor license, please sign-in. Otherwise, an Editor license can be purchased to be able to access the plug-ins.