Object options vs. 1.1.0 Full+Lite

An optional key value object that holds the auto complete component properties.

Properties

String type (Optional - Default: self) vs. 1.1.0 Full+Lite
The data type. This can be "self", "array" or "remote". It also can be any custom data type that extends the ng.AutoComplete component. If the type is "self", the input must be a select menu.
Array src (Optional - Default: Null) vs. 1.1.0 Full+Lite
The data source as an array. This can be a simple array of values (e.g. ['One', 'Two', 'Three']) or an array of objects that define the value, text and html (e.g. [{value:1, text:'one', html:'Number 1', group:'Numbers'}, {value:2, text:'two', html:'Number 2', group:'Numbers'}] value is the only required key, the text will be used in the input field and the html and group will be used in the auto complete drop down).
If the type is "remote", this should be a URL to fetch the data. The return text should be a JSON encoded array as above. The URL query will include the following:
  • text: the full user input
  • precaret: text before the caret
  • postcaret: text after the caret
Integer minimum_length (Optional - Default: 1) vs. 1.1.0 Full+Lite
The minimum text length before searching the data source for matches.
Integer number_results (Optional - Default: 5) vs. 1.1.0 Full+Lite
The maximum results show in the auto complete drop down. This will be ignored if the type is remote.
Boolean force_selection (Optional - Default: Null) vs. 1.1.0 Full+Lite
Should the user be forced to select an option (e.g. similar to a select menu). This is true if the type is "self" from a select menu and false otherwise.
String css_prefix (Optional - Default: ng_autocomplete_) vs. 1.1.0 Full+Lite
The CSS class prefix for the auto complete skin.
String value (Optional - Default: Null) vs. 1.1.0 Full+Lite
The current selected value as a string, object (e.g. {value:'my value', text:'my text'}) or array (e.g. [{value:'my value', text:'my text'}, {value:'my value', text:'my text'}] - for multiple selection). This can also be assigned by adding the value to the input field or have a selected option in a select drop down. For multiple selection and input field, it should be a text area and each value in a new line.
String caption (Optional - Default: (blank string)) vs. 1.1.0 Full+Lite
A caption that will be placed inside the input field when the value is empty. This caption will not be submitted to the server.
Integer remote_delay (Optional - Default: 100) vs. 1.1.0 FULL ONLY
How many milliseconds should the auto complete component wait before sending requests to the server for remote data.
Function remote_output_process (result) (Optional - Default: Null) vs. 1.1.0 FULL ONLY
If the remote data is not a JSON encoded array. This function can convert it into a data array (same as source data).
Boolean multi_selection (Optional - Default: Null) vs. 1.1.0 Full+Lite
Allow the user to select more than one option. When true, the selected options will be submitted as a string separated by a new line character (n). If this option is null and the type is "self", it will be set to the select element multiple value. Otherwise it will be false.
HTML_Element multi_selection_holder (Optional - Default: Null) vs. 1.1.0 Full+Lite
Where to place the selected options. If Null, they will be placed in front of the input field.
Integer max_selection (Optional - Default: 0) vs. 1.1.0 Full+Lite
The maximum number of options the user can select. If set to 0, the user will be able to select unlimited number of options.
Regular Expression pattern (Optional - Default: Null) vs. 1.1.2 Full+Lite
A regular expression that will be used to search the results. If null, the regular expression will be used based on the user input and caret position.

Inherit Options from ng.Component (options)

HTML_Element input (Optional - Default: Null) vs. 1.1.0 Full+Lite
An input field that is associated with the component. Focusing or clicking on this HTML Element will show the component.
String placement (Optional - Default: aaaa) vs. 1.1.0 Full+Lite
As of version 1.1.3, the default is set to aaaa which is an automatic placement based on the input field placement on the view port and the language. A string that represents the placement of the component. It consists of four letters to define the position of the component in relation to the input field. The letters are defined as the following:
  • First letter: The top or bottom of input field (either t or b)
  • Second letter: The left or right of the input field (either l or r)
  • Third letter: The top or bottom of the component (either t or b)
  • Fourth letter: The left or right of the component (either l or r)
For example, the value bltl will place the component top left position on the input bottom left position. From version 1.1.2 and below the default is bltl (for RTL languages brtr).
Boolean visible (Optional - Default: false) vs. 1.1.0 Full+Lite
Is the component always visible or does it appear and disappear based on the user interaction.
Object offset (Optional - Default: {x:0, y:0}) vs. 1.1.0 Full+Lite
An x and y object on how far to offset the component from the input and placement position (e.g. {x:5, y:5});
Button button (Optional - Default: Null) vs. 1.1.0 Full+Lite
An optional button that will toggle the component when clicked.
Component parent (Optional - Default: Null) vs. 1.1.0 Full+Lite
If the component is nested within other component, the parent should be included in this option. This option allow opening and closing sub components without changing the parents status.
Boolean disabled (Optional - Default: false) vs. 1.1.0 Full+Lite
True or false if the component should be disabled or not.
Boolean open_onfocus (Optional - Default: true) vs. 1.1.0 Full+Lite
Should the component be opened when the user focus on the input field.
Boolean open_onclick (Optional - Default: true) vs. 1.1.0 Full+Lite
Should the component be opened when the user clicks on the input field.
String button_ui_class Required vs. 1.2.0 Full+Lite
An optional class name to add to the component's buttons. This allow to change the color of the buttons for different components.
Integer responsive_top (Optional - Default: Null) vs. 1.2.1 Full+Lite
A fix top position for components in responsive layout. If set to null, the component will be centered on the screen. If the value is below 15, it will automatically changed to 15 (to keep the close button visible).
Integer responsive_left (Optional - Default: Null) vs. 1.2.1 Full+Lite
A fix left position for components in responsive layout. If set to null, the component will be centered on the screen.
Boolean is_moving_input (Optional - Default: false) vs. 1.2.1 Full+Lite
A read only value that indicates if the input fields is being moved from the normal position to the responsive position. This value should be checked if the input field has a blur event that change the component status because when the element is moved, some browsers trigger the blur event. For example: if (this.p.is_moving_input) return
String buttons_color (Optional - Default: transparent (Configuration value)) vs. 1.1.0 Full+Lite. Deprecated in vs 1.2.0
As of version 1.2.0, this option is deprecated and will be removed in version 1.2.5. The color of the created by the calendar.
String buttons_over_color (Optional - Default: #ffd06e (Configuration value)) vs. 1.1.0 Full+Lite. Deprecated in vs 1.2.0
As of version 1.2.0, this option is deprecated and will be removed in version 1.2.5. The color of the buttons when the mouse is over them.
String buttons_down_color (Optional - Default: Null (Configuration value)) vs. 1.1.0 Full+Lite. Deprecated in vs 1.2.0
As of version 1.2.0, this option is deprecated and will be removed in version 1.2.5. The color of the buttons when the user click on them.
String buttons_checked_color (Optional - Default: #f5be5b (Configuration value)) vs. 1.1.0 Full+Lite. Deprecated in vs 1.2.0
As of version 1.2.0, this option is deprecated and will be removed in version 1.2.5. The color of the calendar buttons when the component is opened.
String buttons_disable_color (Optional - Default: Null (Configuration value)) vs. 1.1.0 Full+Lite. Deprecated in vs 1.2.0
As of version 1.2.0, this option is deprecated and will be removed in version 1.2.5. The color of the buttons when the calendar is disabled.
Boolean button_light_border (Optional - Default: false (Configuration value)) vs. 1.1.4 Full+Lite. Deprecated in vs 1.2.0
As of version 1.2.0, this option is deprecated and will be removed in version 1.2.5. True or false to use a light border around the buttons. By default, the border is darker color of the button color, but if this is set to true, the border color is lighter. This is useful when the button is dark and the page background is dark as well.
Boolean buttons_gloss (Optional - Default: true (Configuration value)) vs. 1.1.0 Full+Lite. Deprecated in vs 1.2.0
As of version 1.2.0, this option is deprecated and will be removed in version 1.2.5. To show a gloss reflection on the button or not.

Inherit Options from ng.PlugIn (options)

HTML_Element object (Optional - Default: Null) vs. 1.1.0 Full+Lite
The HTML Element that will hold all the plugin output and handle all the events. By default, an new DIV will be created at the bottom of the body.
String language (Optional - Default: en (Configuration value)) vs. 1.1.0 Full+Lite
The default plugin language.

API Menu