We’re rewarding the question askers & reputations are being recalculated! Read more.
26

Go to chrome://flags/#enable-scroll-anchoring the highlighted option is Scroll Anchoring disable it. Now you will see the message "Your changes will take effect the next time you relaunch Google Chrome." in the bottom with a button RELAUNCH NOW, When you hit this button chrome will relaunch. So first save all your work and then hit this button. Credit: @...


12

There is a Known Issue for this - Developer Console jumping when using mouse scroll Summary When working in any piece of code in the Developer Console (apex class, lightning component, trigger and so on) if the user start scrolling down through the content of the piece of code using a mouse wheel, the screen starts scrolling, but then the view ...


9

<apex:commandButton value="..." action="..." onclick="..." reRender="someAreaById" oncomplete="scrollSomewhere()" /> someAreaById should be the area to be refreshed; you can can give the form itself an Id and rerender the entire form. This is usually what I do if I can't readily determine which parts of the form may be ...


7

When locker service is in place, the golden rule is: you cannot access the DOM of the components you do not own Why this is enforced? It is mainly to preserve the component encapsulation, so that developer can not accidentally/intentionally access the other developers component(one's they do not own) or even in worst case break other components ...


6

I tried to make this code work inside Lightning but failed because Lightning seems to be only a subset of Aura. Lightning is running a full copy of Aura. However, it's not running the current version of Aura. There's some lag time between what we have in Lightning and what we have in Aura; most likely, the introduction of ui:scroller means that we'll see it ...


5

There's already a known issue on this, you can probably click "This Issue Affects me" button if you're interested. You can use newly added Lightning component in the Winter '17, ui:scrollerWrapper that enables native scrolling in Lightning Components Salesforce1 app as well as in Lightning Desktop. A ui:scrollerWrapper creates a container that enables ...


4

Quickest way to do this would be to use StickyTableHeaders. (Most reliable solution I have used) and provides the most standard like UI compared to other solutions. Datatables.net is also a great resource if you want to add search and filtering. I like it much better that jQuery data tables. https://github.com/jmosbech/StickyTableHeaders Here is a MVR ...


4

We've had good success with the following pattern: <aura:component implements="...." controller="...."> <ui:scrollerWrapper class="scrollerSize"> <div class="innerDivWrapper"> <!-- Your Content here... --> </div> </ui:scrollerWrapper> </aura:component> And the CSS: .THIS....


4

scrollTo(target, top, left) isn't a valid set of parameters for scrollTo, so presumably you're using a custom function. The way you'd do this using just standard JavaScript/Lightning would look like this: var target = component.find("target"); var element = target.getElement(); var rect = element.getBoundingClientRect(); scrollTo({top: rect.top, behavior: "...


4

If you want the spinner to follow the user's scroll, you can modify the position of the spinner. By default, Lightning add the spinner to the center of the page. Using a div with the slds-spinner class with the following style: .slds-spinner { position: absolute; top: 50%; left: 50%; } To make this div follow the scroll, you can override this ...


3

The propper syntax for scrollTo according to the documentation: scrollTo('custom', 0, 0); or scrollTo('top'); I reproduced it, called the methods as documented and was also not able to scroll to top, I guess it's just another feature that is not working properly. after some more research, I found out the following works: top: function(component, event, ...


3

tl;dr: I wasn't able to keep the datepicker position adjusted, but I did find an explanation for why the standard datepicker is behaving the way it is. It took an amount of searching and luck, but I was able to find another question that had a similar (but different) issue. Datepicker widget location issue The answer by Mark Masterson contains some ...


3

Have you opened a support case on this so we can track getting this fixed? Your scenario does look like it should work under Locker - although there is quite a bit of code under the surface of those libraries - as long as they do not violate the DOM visibility rules this should work. With that said I am skeptical that this works inside of one.app (...


3

Wrap what you need to display conditionally into a <apex:outputPanel> and use the rendered. Since you can use a formula inside of this attribute, you can do something like : <apex:outputPanel rendered="{!TODAY() + 2 >= Campaign.Date__c}"> <div>...</div> </apex:outputPanel> You may have to adjust the date formula, but ...


2

Try putting a div around your datatable with an overflow style and max height. Other overflow options are available. <apex:outputPanel layout="block" style="max-height:400px; overflow:scroll" id="main"> <apex:dataTable value="{!accList}" var="account"> <apex:column> <apex:facet name="header">Account ID</apex:facet> ...


2

Sounds like it could be this long-standing Visualforce issue: https://success.salesforce.com/issues_view?id=a1p30000000T2oL A workaround script run after the page has fully loaded usually helps to stabilize the page (simplified to remove User Agent check that is included in link): (function(){try{ var s=document.createElement('style'); s.innerHTML="html,...


2

This issue no longer exists. Checking in the Winter 17 release, it is working.


2

I had faced this similar issue where I was not able to scroll a datatable horizontally on iPad and iPhone however it worked fine on Android. There is an issue with the status "In Review" on Salesforce Trailblazer Community for this bug. As a workaround, I added a div with a height of 5px below the datatable and reduced the height of the parent div by 5 px. ...


2

What about just keeping the scrollableinnerWrap with the following CSS: .THIS .scrollableinnerWrap{ height: 90vh; width: 100%; } and replace the outermost with a div having following CSS: .THIS .outer-container{ position:fixed; } In case we want to keep both, I think we can apply the above CSS for outer scrollWrapper and apply the ...


2

If Martin Lezer's answer is not what you're looking for, you can just put the lightning:spinnner outside of the <div class="slds-is-relative">. The spinner will be centered and the user will not be able to scroll.


2

Looking at the source code of ui:scrollerWrapper here: https://github.com/forcedotcom/aura/blob/master/aura-components/src/main/components/ui/scrollerWrapper/scrollerWrapper.cmp I can see that there is no external event or action that allows to capture a scrolling event. Unfortunately ui:scrollerWrapper isn't extensible so you can't inherit from it. ...


2

Presuming the event is firing, you should be able to see if you're at the top via: window.addEventListener('scroll', event => console.log(`scrolled to ${event.target.scrollTop}`));


1

Just put a scroll handler directly on the div, and you can watch the value change, without a watchdog or anything else. This is a pretty standard technique. Here's a small copy-paste example for you. <aura:application > <aura:attribute name="pos" type="Integer" default="0" /> {!v.pos} <hr /> <div class="wrapper" ...


1

The below code worked for me. var scrollOptions = { left: 0, top: 0, behavior: 'smooth' } window.scrollTo(scrollOptions); Here is the reference to scrollOptions documentation Thanks!


1

I searched farther and found a solution in this article here It doesn't solve the issue entirely though because there seems to be limited child page functionality, such as losing the ability to pull down for refresh. If anyone can identify the cause, that may help to discover a more complete solution.


1

Interacted about this on "Lightning Components - Trailblazers" group. Cross posting my response here. Problem is that aura:id="editModeScrollBarY" aura:id maps to to ui:inputTextArea. As that component is in a different namespace, your component doesn't have access to the dom elements owned by it. Hence, you are not allowed to call getElement(). You could ...


1

One easy way to implement this requirement is using Jquery datatable plugin. It will give you horizontal and vertical scrolling including many other functionality. Here is a sample Visualforce Page. Hope this helps. <apex:page standardController="Account" recordSetVar="accounts" > <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12....


1

You can use newly added Lightning component in the Winter '17, ui:scrollerWrapper that enables native scrolling in Lightning Components Salesforce1 app as well as in Lightning Desktop. A ui:scrollerWrapper creates a container that enables native scrolling in Salesforce1. This component enables you to nest more than one scroller inside the container. ...


1

In your page layout, ensure that "Show Scrollbars" is checked for your Visualforce Page item.


1

A temporary solution to enable scrolling is to wrap your component inside a flexipage. When the component utilized the Lightning App Builder as a wrapper, there are no issues with scrolling. To do this, modify your current Lightning Component as follows: Modify from: <aura:component implements="force:appHostable" > To: <aura:component implements=...


Only top voted, non community-wiki answers of a minimum length are eligible