function readOnly(count){ }
Starting November 20, the site will be set to read-only. On December 4, 2023,
forum discussions will move to the Trailblazer Community.
+ Start a Discussion
SerobaSeroba 

Enable Aura Component to scroll in mobile app

When I navigate from an aura component to another, the second component does not respond to class="slds-scrollable"
(NB this is only an issue on the Salesforce Mobile app, not desktop)

BeginScreen.cmp
<aura:component implements="forceCommunity:availableForAllPageTypes,force:lightningQuickAction,force:hasRecordId,force:appHostable" access="GLOBAL" >

    <aura:handler name="init" value="{!this}" action="{!c.doInit}"/>

        <div class="slds-m-top--xx-large">
            <div class="slds-m-around_large">
                <div class="slds-text-heading_small slds-m-bottom_x-small">Navigato to ScrollScreen</div>
                <button class="slds-button slds-button--brand" type="button" onclick="{!c.navBookTechOnsite}">Tap Here...</button>
            </div>
        </div>

</aura:component>

BeginScreenController.js
({
    doInit : function(component, event, helper) {
        var caseId = component.get("v.recordId");
    },
    
    navBookTechOnsite : function(component, event, helper) {
        alert('Navigating to c:ScrollScreen...');
        var evt = $A.get("e.force:navigateToComponent");
        evt.setParams({
            componentDef : "c:ScrollScreen",
            //Pass value to caseRecordId attribute
            componentAttributes :{
                caseRecordId: component.get("v.recordId")
            }
        });
        evt.fire();
    }
})

ScrollScreen.cmp
<aura:component implements="forceCommunity:availableForAllPageTypes,force:lightningQuickAction,force:hasRecordId,force:appHostable" access="GLOBAL" >
    
    
    <aura:attribute name="caseRecordId" type="String" />
    <aura:attribute name="recordError" type="String" />
    <aura:attribute name="record" type="Object" />
    <aura:attribute name="caseRecord" type="Object" />
    <aura:attribute name="recordSaveError" type="String" default=""/>
    
    <aura:handler name="init" value="{!this}" action="{!c.doInit}"/>

    <div class="slds-modal__content slds-p-around--small slds-grid slds-wrap">
        <h2 class="slds-section__title-action slds-size--1-of-1 slds-m-around-small">Scroll Screen</h2>
        <!-- Display error message --> 
        <aura:if isTrue="{!not(empty(v.recordSaveError))}">
            <div class="recordError">
                {!v.recordSaveError}
            </div> 
        </aura:if>
            <!-- Display an editing form -->
            <lightning:input label="Case Number" value="{!v.caseRecord.CaseNumber}" class="slds-size--1-of-1"/>
            <lightning:input label="Customer Name" value="{!v.caseRecord.Contact.Name}" class="slds-size--1-of-1"/>
            <lightning:input label="Scheduled Technician" value="{!v.caseRecord.Scheduled_Technician_naming__c}" class="slds-size--1-of-1"/>
            <lightning:input label="Case Type" value="{!v.caseRecord.Case_Type__c}" class="slds-size--1-of-1"/>
            <lightning:input label="ETA" value="" class="slds-size--1-of-1"/>
            
            <div class="slds-m-around_large">
                <div class="slds-text-heading_small">Make this screen scrollable</div>
                <lightning:select aura:id="selectBookTechn" name="selectBookTechn" onchange="{! c.onChangePictureType }">
                    <option value="Picture of the front of the vehicle">Picture of the front of the vehicle</option>
                    <option value="Picture of license disk">Picture of license disk</option>
                    <option value="Picture of vehicle dash">Picture of vehicle dash</option>
                    <option value="Picture of the cluster">Picture of the cluster</option>
                </lightning:select>
            </div>
            
            
            <div class="slds-text-body_regular slds-size--1-of-1 slds-m-top--medium slds-text-title_bold">
                <lightning:fileUpload
                                      multiple="true"
                                      accept=".pdf, .jpg"
                                      recordId=""
                                      onuploadfinished="{!c.handleUploadFinished}" />
                
            </div>
        <div class="slds-modal__footer">             
            <lightning:button variant="neutral" label="Save" onclick="{!c.navAnyFaultItems}" class="slds-m-top_small"/>
        </div>
    </div>   
</aura:component>

ScrollScreenController.js
({
    doInit : function(component, event, helper) {
        var caseId = component.get("v.caseRecordId");
        alert('Passed Id is: ' + caseId);
    }
})