diff --git a/readme.md b/readme.md index 1263385..f75582d 100644 --- a/readme.md +++ b/readme.md @@ -83,6 +83,21 @@ A suggestion is an object of the form `{ value: string, data: any }`. `data` is passed through untouched to `formatResult`, `onSelect`, and the grouping key resolver. +To match regardless of accents (so `cafe` finds `Café`), pass a custom +`lookupFilter` that strips diacritics from both sides: + +```js +const fold = (text) => text.normalize('NFD').replace(/\p{M}/gu, '').toLowerCase(); + +$('#autocomplete').devbridgeAutocomplete({ + lookup: countries, + lookupFilter: (suggestion, query) => fold(suggestion.value).includes(fold(query)), +}); +``` + +The default `formatResult` still highlights only exact (case-insensitive) +matches, so an accent-folded match is listed but not highlighted. + ### Ajax-only settings | Setting | Default | Description | @@ -212,6 +227,20 @@ Minimal CSS to get started: `cursor: pointer` on `.autocomplete-suggestion` is required for tap-to-select to fire on mobile Safari — see issue #542. +To highlight matches with a different element, e.g. ``, wrap the +default formatter. It escapes everything except its own `` tags, so +swapping the tag is safe: + +```js +$('#autocomplete').devbridgeAutocomplete({ + lookup: countries, + formatResult: (suggestion, currentValue) => + $.Autocomplete.defaults + .formatResult(suggestion, currentValue) + .replace(/<(\/?)strong>/g, '<$1mark>'), +}); +``` + ## Response format The server must respond with JSON in this shape: