Please help with demo of autocomplete with renderItem and renderDropdown

I have scanned the forum and the net without success and would really appreciate any clear instructions on how to apply custom rendering of the autocomplete dropdown (adding classes or column of icons for example). Browsing the sources of the autocomplete.js does not help me that much I’m afraid.

If any of the examples at would have such an example, that would be really helpful.

Thanks for an incredible framework. Amazingly well done!

What I can tell you is - it autocompletes text - something people type at the keyboard. It will autocomplete on a list (array) of one column.
If you need to get some other thing - an icon perhaps - based on what people type, that may be a 2nd operation.

In order to avoid a REST request and response from my server, I have several thousand items in the autocomplete array - and have several of these arrays.

Thanks for the reply,
as an example, a return collection could be a mix of different types, and an icon would then indicate the type, followed by the name corresponding to the entered text. Sorry if that wasn’t clear in the question.

The data in my circumstances would come from an ajax response.

[ma          ]

| Malvern Hills      | (district-icon) |
| Manchester         | (city-icon)     |

Im still learning Framework 7. But you may have to have an array of only the text, the key. Then a second array with your text, the key and the icon. Use first array to find what user wants. With this value, search 2nd array. This is how I would approach it with the auto complete. Again, autocomplete only finds matching text