TIWCGJQDropDownOptions Properties

 NameDescription
AcceptHTML

When True, the item caption will accept the html tags.

Ajax

Options for the built in ajax query function. This object acts as a shortcut for having to manually write a function that performs ajax requests. The built-in function supports more advanced features such as throttling and dropping out-of-order responses.

In order for this function to work Select2 should be attached to a input type='hidden' tag instead of a select.

AllowClear

Whether or not a clear button is displayed when the select box has a selection. The button, when clicked, resets the value of the select box back to the placeholder, thus this option is only available when the placeholder is specified.

This option only works when the placeholder is specified

When attached to a select an option with an empty value must be provided. This is the option that will be selected when the button is pressed since a select box requires at least one selection option.

Also, note that this option only works with non-multi-value based selects because multi-value selects always provide such a button for every selected option.

AttachTo

It can be attached to select or input

Note: Some properties and functions are avaliable only when attached to input. Please read the documentation for each property on author home page: http://ivaynberg.github.com/select2/select2-latest.html#documentatio n

CaseSensitive

Determines case sensitivity

CloseOnSelect

If set to true the dropdown is not closed after a selection is made, allowing for rapid selection of multiple items. By default this option is disabled.

Only applies when configured in multi-select mode.

ContainerCss

Inline css that will be added to select2's container. Either an object containing css property/value key pairs or a function that returns such an object.

ContainerCssClass

Css class that will be added to select2's container tag

CreateSearchChoice

Creates a new selectable choice from user's search term. Allows creation of choices not available via the query function. Useful when the user can create choices on the fly, eg for the 'tagging' usecase.

If the function returns undefined or null no choice will be created. If a new choice is created it is displayed first in the selection list so that user may select it by simply pressing enter.

Data

Options for the built in query function that works with arrays.

If this element contains an array, each element in the array must contain id and text keys.

Alternatively, this element can be specified as an object in which results key must contain the data as an array and a text key can either be the name of the key in data items that contains text or a function that retrieves the text given a data element from the array

DropDown

Represents property DropDown.

DropDownCss

Inline css that will be added to select2's dropdown container. Either an object containing css property/value key pairs or a function that returns such an object.

DropDownCssClass

Css class that will be added to select2's dropdown container

EscapeMarkup

Function used to post-process markup returned from formatter functions. By default this function escapes html entities to prevent javascript injection.

FormatInputTooShort

Function used to render the "Search input too short" message

FormatNoMatches

Function used to render the "No matches" message

FormatResult

Function used to render a result that the user can select.

The default implementation expects the object to have a text property that is returned.

The implementation may choose to append elements directly to the provided container object, or return a single value and have it automatically appended

FormatResultCssClass

Function used to add css classes to result elements.

By default when attached to a select css classes from options will be automatically copied

FormatSearching

Function used to render the "Searching..." message that is displayed while search is in progress

FormatSelection

Function used to render the current selection.

The default implementation expects the object to have a text property that is returned.

The implementation may choose to append elements directly to the provided container object, or return a single value and have it automatically appended

FormatSelectionTooBig

Function used to render the "You cannot select any more choices" message

Id

Function used to get the id from the choice object or a string representing the key under which the id is stored.

InfiniteScroll

If True allows Infinite Scroll OnGetCompleteData should check APage param and return IsMore if there is more data to send after.

InputTooShortMsg

Search Input too short Caption

LoadMorePadding

Defines how many pixels need to be below the fold before the next page is loaded. The default value is 0 which means the result list needs to be scrolled all the way to the bottom for the next page of results to be loaded. This option can be used to trigger the load sooner, possibly resulting in a smoother user experience.

MapID

Represents property MapID.

Matcher

Used to determine whether or not the search term matches an option when a built-in query function is used. The built in query function is used when Select2 is attached to a select, or the local or tags helpers are used.

MaximumInputLength

Maximum number of characters that can be entered for an input

MaximumSelectionSize

The maximum number of items that can be selected in a multi-select control. If this number is less than 1 selection is not limited.

Once the number of selected items reaches the maximum specified the contents of the dropdown will be populated by the formatSelectionTooBig function

MinimumInputLength

Number of characters necessary to start a search

MinimumResultsForSearch

The minimum number of results that must be initially (after opening the dropdown for the first time) populated in order to keep the search field. This is useful for cases where local data is used with just a few results, in which case the search box is not very useful and wastes screen space.

Only applies to single-value select boxes

Multiple

Whether or not Select2 allows selection of multiple values.

NoMatchesMsg

Caption when no matches are found

OnBlur

Trigger on blur

OnChange

Fired when selection is changed.

This event is not fired when the selection is changed using Select2's val() method.

The event object contains the following custom properties:

val: the current selection (taking into account the result of the change) - id or array of ids.

added: the added element, if any - the full element object, not just the id.

removed: the removed element, if any - the full element object, not just the id.

OnFocus

Trigger on focus

OnInitSelection

Called when Select2 is created to allow the user to initialize the selection based on the value of the element select2 is attached to.

This function will only be called when there is initial input to be processed.

OnOpen

Fired when the dropdown is shown.

The event listener can prevent the opening by calling preventDefault() on the supplied event object.

OnOpening

Trigger on opening the dropdown.

OnSortResults

Used to sort the results list for searching right before display. Useful for sorting matches by relevance to the user's search term.

OnTokenizer

A tokenizer function can process the input typed into the search field after every keystroke and extract and select choices. This is useful, for example, in tagging scenarios where the user can create tags quickly by separating them with a comma or a space instead of pressing enter.

Tokenizer only applies to multi-selects

OpenOnEnter

If set to true the dropdown is opened when the user presses the enter key and Select2 is closed. By default this option is enabled.

Placeholder

Initial value that is selected if no other selection is made.

The placeholder can also be specified as a data-placeholder attribute on the select or input element that Select2 is attached to.

Note that because browsers assume the first option element is selected in non-multi-value select boxes an empty first option element must be provided (<option></option>) for the placeholder to work.

PopupHeight

Popup height

Query

Function used to query results for the search term.

ReadOnlyPreselected

When True, will prevent the removing of pre-selected items.

Important Note
For Multiple only.
SearchingMsg

Caption to put when is Searching

SelectionTooBigMsg

Selection too big msg

SelectOnBlur

Set to true if you want Select2 to select the currently highlighted option when it is blurred

Separator

Separator character or string used to delimit ids in value attribute of the multi-valued selects. The default delimiter is the , character.

Sortable

JQDropDown supports drag and drop sorting of selected choices.

Note: The sorting is only available when JQDropDown is attached to a input.

Tags

Puts Select2 into 'tagging'mode where the user can add new choices and pre-existing tags are provided via this options attribute which is either an array or a function that returns an array of objects or strings. If strings are used instead of objects they will be converted into an object that has an id and text attribute equal to the value of the string.

TokenSeparators

An array of strings that define token separators for the default tokenizer function. By default, this option is set to an empty array which means tokenization using the default tokenizer is disabled. Usually it is sensible to set this option to a value similar to [',', ' ']

Width

Controls the width style attribute of the Select2 container div. The following values are supported:

off : No width attribute will be set. Keep in mind that the container div copies classes from the source element so setting the width attribute may not always be necessary.

element : Uses javascript to calculate the width of the source element.

copy : Copies the value of the width style attribute set on the source element resolve First attempts to copy than falls back on element

other values : if the width attribute contains a function it will be avaluated, otherwise the value is used verbatim

Top