render() appears to break scrolling in onyx.Picker

I'm trying to develop a generic dropdown kind that allows dynamically reloading the list of options. See jsfiddle.net/kenpaul/YMUkN/ for an example, including a sample App that invokes it. As currently coded, the app generates 2 dropdowns, both of which scroll and select properly when loaded. Changing the selection in dropdown 1 causes a new list of options to be loaded in dropdown 2, at which point only the first few items show, and scrolling is apparently disabled. I've tried using render() or not in both reloadItems() and itemSelected() and haven't found a combination that works correctly both initially and after reloading. It looks like render() breaks the scrolling, but I hope that's wrong. Any help would be appreciated.

Comments

  • You hitting a bug that I thought we'd completely eliminated, but it looks like you found a new reproduction. Something about the multiple render calls is generating multiple copies of the popup in the DOM, and only one is associated with the scroller. I'll debug this a little more and see if its on our side or your side of the code.
  • edited December 2012
    OK, the problem is that render() doesn't handle the case where children are rendered outside the normal DOM tree well. For the PickerDecorator, it's child, the Picker, is actually rendered into a separate FloatingLayer.

    The fix is in your code. In your reloadItems() call, instead of calling this.render(); call this.$.ddpick.render(); instead. This focuses the re-rendering on the list inside of the popup, rather than the decorator and all the things that own the layers above the list. This avoids triggering the bug. However, I'll file an issue to track this problem so your original code would work too.
  • Many thanks -- that works perfectly. And I'll watch for a fix for the original code.
  • edited January 2013
    I ran into this as well, and I didn't see an existing issue for it. https://enyojs.atlassian.net/browse/ENYO-1902
  • Travis, did you try the fix I suggested?
  • edited January 2013
    Yes I've removed the symptom, but I don't consider anything fixed. This is still a bug that needs to be resolved, imo. Thanks for your help.
  • OK, just wanted to make sure it wasn't a separate problem.
  • I have the same problem. Sadly, calling render for the Picker only it's not a fix for me, because when the Picker's parent gets a render() call and breaks the picker completely and no option is shown. Any other solution?
  • is this problem ever gonna get resolved. I'm been struggling with all kinds workarounds since day one of project :(
  • i actually have a SpecialPicker components which have my own comprises of onyx.PickerDecorator, onyx.PickerButton and onyx.Picker. I still have problems when the parent is rendered. Ben what is the best work around for this. Should I write a public function for kind:"SpecialPicker" that deal with this like forceRefresh()?
  • I'm in the same position as @isgoodstuff‌. Any suggestions?
  • edited December 2014
    I updated the original filter to work with the nightly build and I don't see any errors. Is your code similar to that, @jcarlin? What's unique in your scenario?

    http://jsfiddle.net/YMUkN/7/
Sign In or Register to comment.