How can I get the selected item of an igCombo scrolled to the top of the opened combo when the combo is opened?
[ Combo Box | v ]
--------------------------------
Selected Item <=================
Non-selected item 1
Non-selected item 2
I had to tweak it because it seemed to leave the "active" style on the previously selected "index", but this is working for me. Thanks for all your help.
Hi Justin,
I've made a small correction to make it work with virtualization as well:
dropDownOpened: function (evt, ui) { if (ui.owner.selectedItems()) { var listHolder = ui.owner.dropDown().find(".ui-igcombo-listitemholder"); var selectedElemIndex = listHolder.children().index(ui.owner.selectedItems()[0].element) var itemHeight = listHolder.height() / listHolder.children().length; var currentScroll = ui.owner.listScrollTop(); var newScroll = currentScroll + selectedElemIndex * itemHeight; ui.owner.listScrollTop(newScroll); } }
Please let me know if you have further questions.
Hristo
Should this work with virtualization enabled?
Hello Justin,
Sorry for my delayed reply. The desired can be achieved executing a custom code that finds the selected item index in the combo list and uses the listScrollTop method to scroll the list :
if (ui.owner.selectedItems()) { var listHolder = ui.owner.dropDown().find(".ui-igcombo-listitemholder"); var selectedElemIndex = listHolder.children().index(ui.owner.selectedItems()[0].element) var itemHeight = listHolder.height() / listHolder.children().length; ui.owner.listScrollTop(selectedElemIndex * itemHeight); }
Please review the updated jsFiddle and let me know if you have further questions. I will be glad to help.
Hello,
Any updates on this?