Autocomplete type
Autocomplete lazy mode

This example shows the usage of the Autocomplete feature in the default lazy mode. In this mode, user can choose one of the suggested options while typing or enter a custom value that is not included in the suggestions. In this mode, the mouse and keyboard bindings are identical as in Handsontable cell type. The options are rendered from the source property which can be an array, or a function that returns an array.

Autocomplete strict mode

This is the same example as above with a difference that autocomplete now runs in strict mode. In this mode, the autocomplete cells will only accept values that are defined in the source array. The mouse and keyboard bindings are identical as in Handsontable cell type with some differences. In strict mode, the allowInvalid option determines the behaviour in case of manual user input.

Autocomplete strict mode (Ajax)

Autocomplete can be also used with ajax data source. In the below example, suggestions for the "Car" column are loaded from server. To load data from remote (asynchronous) source, assign a function to the source property. Function should perform the server side request and call the callback function when the result is available.

Password type
Password cell type

The following examples show how to configure Handsontable with password cell type. This kind of cell behaves like a text cell with a difference that it masks its value using asterisk in cell renderer. For the cell editor, a <input type="password"> field is used. Data is stored in the data source as plain text. Additionally you can specify hash length and custom hash symbols.

Fixed hash length

The following examples show how to configure Handsontable with password cell type with limited hash length. By default every hash has length equal to the length of value that it corresponds with. Use option hashLength added to column configuration to set fixed hash length. Here hash length is set to 8, so if password is longer, other symbols are hidden.

Custom hash symbol

The following examples show how to configure Handsontable with password cell type with custom hash symbol. By default every hash consists of asterisks *. Use option hashSymbol to set custom hash symbol. You can use any character, entity or event HTML. Note that you can't change symbol used by the input field due to browsers limitations.