5.20231.904
5.20231.904

MultiAutoComplete

The MultiAutoComplete control is similar to the MultiSelect control. Both controls allow users to select multiple items from lists. However, MultiAutoComplete is different from MultiSelect in following ways:

  1. MultiAutoComplete shows a drop-down that includes only items that match the current input, just like AutoComplete.
  2. MultiAutoComplete shows all the items that are currently selected, and allows users to remove items by clicking them on the list.
  3. MultiAutoComplete exposes the list of selected items through the selectedItems property while MultiSelect uses checkedItems instead.

AutoComplete

HTML
<label for="theMultiAutoComplete">MultiAutoComplete</label>
<div id="theMultiAutoComplete"></div>
Javascript
import * as input from '@grapecity/wijmo.input';
import { getData } from './data';

function init() {
    var theMultiAutoComplete = new input.MultiAutoComplete('#theMultiAutoComplete', {
        placeholder: 'Select some countries',
        displayMemberPath: 'country',
        itemsSource: getData(),
        selectedIndex: -1
    });
}