[Solved] Autocomplete dropdown render

Questions
1

Hi,

I have some issue with rendering the result from autocomplete back to my input field. I can get the result when I do a console.log(results). However, it seems to have some issue with rendering. I see the following error each time it tries to render.

framework7.js:29609 Uncaught TypeError: Cannot read property 'find' of undefined
at framework7.js:29609
at Object.success (app.js:289)
at r (framework7.js:3595)
at XMLHttpRequest.Request.f.onload (framework7.js:3768)

Below is my autocomplete.params

animate: true
autoFocus: false
closeOnSelect: false
dropdownContainerEl: "#item_1" //This is the <input> html element
dropdownPlaceholderText: "Try "Apple""
formColorTheme: undefined
highlightMatches: true
inputEl: "#item_1" //This is the <input> html element where I type to query
inputEvents: "input"
limit: 10
multiple: false
navbarColorTheme: undefined
notFoundText: "Nothing found"
on: {}
openIn: "dropdown"
openerEl: undefined
pageBackLinkText: "Back"
pageTitle: undefined
popupCloseLinkText: "Close"
preloader: true
preloaderColor: undefined
renderDropdown: undefined
renderItem: undefined
renderNavbar: undefined
renderPage: undefined
renderPopup: undefined
renderSearchbar: undefined
requestSourceOnOpen: false
routableModals: true
searchbarDisableText: "Cancel"
searchbarPlaceholder: "Search..."
source: Ć’ (query, render)
textProperty: "name"
typeahead: false
updateInputValueOnSelect: true
url: "select/"
value: undefined
valueProperty: "name"
view: undefined
__proto__: Object

Any advice?

Thanks

2

Solved my own problem. I changed the dropdownContainerEl to the class for the div wrapping the input. Also I reworked how autocomplete will be opened by manually inputting “autocomplete.open()” on events I see needed.

1 Like