Q-Select Autocomplete on object
-
I am having difficulties to make autocomplete work on dynamic object.
my Select looks like this :<q-select label="Part Number" stack-label :value="items[data.key].partNo" :options="partNo" option-value="partNo" option-label="partNo" use-input outlined dense options-dense @filter="filterFn" />
And I have an Array with objects that looks like:
{ partNo: '123456', orgName: 'xxxx', partDesc: 'xxx' }, { partNo: '143566', orgName: 'xxxx', partDesc: 'xxx' } . . .
obviously function from example wont work:
filterFn(val, update, abort) { console.log(val) update(() => { const needle = val.toLowerCase() this.partNo = this.partNo.filter( v => v.toLowerCase().indexOf(needle) > -1 ) }) }
anyone have some nice ideas for that problem ?
-
@Uneasy pls produce a working reproduction codepen.
-
I did actually figured it out using lodash.
I had to create separate data called options or something and assign that to select options
here is my filtering functionfilterFn(val, update, abort) { console.log(val) update(() => { const needle = val.toLowerCase() this.partsOptions = _.filter(this.partNo,function(o){ return o.partNo.val.toLowerCase().indexOf(needle)>-1 }) }) }