0

In salesforce lightning component, we have three different divs which we are hiding and showing as needed using display none css property. Fist div has more contents and we have to scroll the page till the end to submit the form and on submit next page is visible which has few lines of content but we have to scroll up to see those contents. Is there any way that I can avoid scrolling. Second div is taking first div height.

Kitty
  • 157
  • 5
  • 14

4 Answers4

1

You could try this in your doInit controller method: window.scroll(0, 0);

Ovidiu Dolha
  • 5,335
  • 1
  • 21
  • 30
Praveen Kumar P V V
  • 21
  • 3
0

Use below code. As Salesforce lightning use 'transform' CSS property to scroll. Just apply 'scroller' class to the div you want to put on top.

var cssScrolltoTop = $(".scroller"); // css class to find scroll position
    if (cssScrolltoTop) {
        var cssScrolltoTopTransform = cssScrolltoTop.css("transform");
        if (cssScrolltoTopTransform) {
            cssScrolltoTop.css("transform", "translate3d(0px, 0px, 0px)"); //set 'transform' since lighntning architecture uses css 'transfrom' property to scroll 
        }
    }
Gaurav Puranik
  • 1
  • 1
0

I faced similar issues , then we used this event in the controller to resize the div:

$A.get("e.ui:updateSize").fire();

This was later deprecated by salesforce then we wrapped the div which is expanding / collapsing:

<ui:scrollerWrapper >
// Add your <div>
</ui:scrollerWrapper>
Arnaud
  • 3,765
  • 3
  • 39
  • 69
Deepak
  • 1
0

To make the scrollTop = 0 to work the container div has to have an internal scroll. Which we can get by either giving a height via px or via vh.

Try that out it should work. I was facing a similar issue while adding LWC inside Flexi Page. The Flexi page has its own scroller but for that, the scrollTop doesn't work. But if we create a separate scroller at the top-level div then the scrollTop starts to work.

Check this out. I have created this and it works perfectly fine for me: https://webcomponents.dev/edit/3vpWJ46hxykfPSACfuNN

Ayan Sarkar
  • 1
  • 1