Hi,
the igCombo input text disappears when the dataSource was changed at runtime. After every keystroke i call the search engine to get the new result data based on the current input text and then i rebind the igCombo. The valueKey and textKey stays the same. The "allowCustomValue" option is set to TRUE. The expected behavior is that the input text should remain after a rebind if this option is set. The goal is a auto complete search with suggestions like google. Every search request take approximately 20 - 40 milliseconds to finish. The dataSource will be set in the view directly => [(dataSource)]="comboDataSource".
This are my options:
this.comboOptions = { valueKey: 'recordId', textKey: 'recordName', autoComplete: true, virtualization: true, visibleItemsCount: 5, allowCustomValue: true, autoSelectFirstMatch: false, width: '100%' };
Is it a bug or is it a wrong usage?
Hello Jeetendra,
Thank you for contacting Infragistics Developer Support!
I'd have to check out whether the combo behavior is by design or actually a bug. As for the allowCustomValue set to true, this only takes effect
after the combo input is not the active element (i.e. loses focus). If that option is on after losing focus the combo will not remove the text from its input if it can't find a match.
I can provide you with a workaround for your current situation however:
You can do your data rebind inside the combo filtering event while keeping the current combo input value and setting it after rebind.
http://jsfiddle.net/L5Lq2ah0/
Here is the sample in jQuery but the same principles apply to the angular 2 wrappers.
Feel free to contact me for further information.
Hello,
thank you for your fast reply.
Since the new dataSource call is a async call after every keystroke I am using the dataBinding event to get the current input text and the dataBound event to set the text again after it has been disappeared. This is working now! But the fact that the dataSource is changing so often, this leads to strange event behavior of igCombo regarding to "filtering", where I do the async call and "selectionChanged" which is not fireing in all cases and the match highlighting which disappears when the dataSource has been updated.
I have solved this by updating the dataSource only if the search results are different and not on every callback from async search which can result in identical result set in some cases. This solves the match highlighting and the "selectionChanged" problems. To reduce the "filtering" event calls I have set "delayInputChangeProcessing" to a proper value.
I think the igCombo is not made for those use cases in the way I am updating the dataSource. But with some tricks it's working now. Thanks!