[Vertical Alphabetical Scroll] Problem with OutSystems UI sidebar

Forge Component
Published on 4 May by Henrique Batista
8 votes
Published on 4 May by Henrique Batista

Hi Henrique and Bruno,

I suppose you don't really support this widget anymore since the last version dates 2017, although I'm using it in a project and I'm facing some challenges combining it with the sidebar OutSystems UI widget. (the currently used version is 2.3.0). This has happened because the two elements occupy the same area in the DOM and when I click in a letter, the event that reaches this component isn't a letter as expected and throws a Data conversion error. I've managed to surpass most of the challenges, by replacing the pseudo-element :before from the sidebar widget by a DIV with a swipe event attached and appending with JS to the parent element of this component (but this is kinda messy and doesn't seem to be the best approach, rather than a desperate move from a broken man trying to fix this for some time now :') ) Do you have any suggestions to fix this?

Let me know,

João Franco

Hi João,

I use OutSystems UI 2.4.1 and don't have any problem using the vertical scroll, no changes made just using the downloaded version.

Could you share the .oap in which the problem is reproducible?




Hi João,

Yes, this component was a bit forgotten.

I just fixed an issue related to the onClick doesn't work properly and I'll release a new version.
Related to the sidebar, since they both occupy the same area there isn't any trivial solution from my perspective.

Not sure if you tried it before or no, but why not styling the :before to left:0px instead of the -30px? 

Besides that only more complex solutions through js, like forcing the event propagation to the letters or something similar.



Hi again,

I kinda did that you mention but lost the ability of swipe to open the sidebar. 

@Daniël Kuhlmannmvp_badge Regarding the upgrade to the latest version, because it has so many dependencies, at the moment I couldn't save upgrade it without knowing the impact on the other apps.