# MultiAutoComplete

## Content


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](https://cdn.mescius.io/document-site-files/images/3c7113e2-10b3-45ed-8f3b-9fb1e0af2b74/input/multiautocomplete.gif)

##### HTML

```html
<label for="theMultiAutoComplete">MultiAutoComplete</label>
<div id="theMultiAutoComplete"></div>
```
##### Javascript

```javascript
import * as input from '@mescius/wijmo.input';
import { getData } from './data';

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