saytum-autocomplete

2.3.0 • Public • Published

Saytum autocomplete

Using

Install the library

$ yarn add saytum-autocomplete

Add a text (or search) field with a class or id

<form id="form">
  <input type="text" id="element">
</form>

Example

Import the library and create an instance with settings

import SaytumAutocomplete from 'saytum-autocomplete'; 
 
new SaytumAutocomplete({
  elInput: '#element',
  customResult: '',
  customClassResult: '',
  minLength: 1,
  classResult: 'autocomplete__result',
  classNoResult: 'autocomplete__no-result',
  classResultItem: 'autocomplete__item',
  classResultRootItem: 'autocomplete__root',
  classItemName: 'autocomplete__name',
  classItemPlaceholder: 'autocomplete__placeholder',
  classHistoryClear: 'autocomplete__history-clear',
  classActive: 'active',
  customEnterEvent: (event, activeItemIndex, data) => {
    console.log('customEnterEvent', event, activeItemIndex, data);
  },
  customClickEvent: (event, activeItemIndex, data) => {
    console.log('customClickEvent', event, activeItemIndex, data);
  },
  customDataFunction: (data) => {
    console.log('customDataFunction', data);
  },
  customKeywordName: 'keyword',
  noResultsText: '',
  requestType: 'POST',
  params: {},
  ajaxDelay: 300,
  historytrue,
  historyTitle: 'History user',
  maxLengthHistory: 6,
  submitButtonActive: false,
  visibleProperties: ['name''address'],
  groupBy: 'type',
  url: 'https://site.ru/api'
});

Add styles - autocomplete.sass or autocomplete.css.

Readme

Keywords

none

Package Sidebar

Install

npm i saytum-autocomplete

Weekly Downloads

6

Version

2.3.0

License

MIT

Unpacked Size

111 kB

Total Files

14

Last publish

Collaborators

  • mkisseloff