1

I am in process of implementing a native old HTML table (<table> ... </table>) in a Lightning Aura Component which will be rendered in native Salesforce Mobile App (historically known as Salesforce1). I cannot use lightning:datatable here as it is not supported in the app and that I also know this is not the best UX but there is a history to this why it all ended up this way. As the table itself has quite a few rows and columns thus I need both a vertical and horizontal scroll.

While I am able to get vertical scroll working using ui:scrollerWrapper but the horizontal scroll does not work consistently. Note that ui:scrollerWrapper does not support horizontal scroll as documented but the interesting fact here is that it actually works on Android devices and that on iOS it's hyper-sensitive. There's a known issue related to this behavior on horizontal scroll but doesn't seem to have been documented correctly as the issue refers using ui:scrollerWrapper whereas the docs mention that horizontal isn't supported at all.

Additionally, I am not able to use SLDS Scrollable as that's not compatible with Salesforce Mobile App either.

My current code looks as below:

Component

<ui:scrollerWrapper class="scrollerSize">
    <table>
     <!-- all stuff goes here -->
    </table>
</ui:scrollerWrapper>

CSS

.THIS .scrollerSize {
    height: 100%;
    width : 100%;
    overflow : scroll;
    border-radius: 1px;
}

My question to the Community here is:

Has anyone been able to successfully implement a horizontal scroll in a HTML table on Salesforce Mobile App (as well as vertical scroll)? Either using standard available components or any other library that I can use?

  • Would love to know if anyone has a solution for this yet. – Bow-chicawow-ers May 27 at 19:23
1

Update for whoever gets to this question or are facing this issue.

We went back to Salesforce on this and they confirmed that Horizontal Scroll on iOS devices is a known issue (citing the same known issue as in the question body) and that the Product Team has this on their roadmap with no timelines available as of yet. Also there was no workaround that works here.

During this implementation we though observed at times the horizontal scrolls worked fine even on iOS devices in one sandbox but not the other. It was just that the behavior was never consistent so we couldn't really rely on this implementation.

In this scenario the option that we had was to implement a similar view that out of the box screens provides for a list view, i.e., stacked rows, more mobile friendly with vertical scrolls working as expected.

| improve this answer | |

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.