function readOnly(count){ }
Sign Up ›
Starting November 20, the site will be set to read-only. On December 4, 2023,
forum discussions will move to the Trailblazer Community.
Learn More

Browse by Topic
ShowAll Questionssorted byDate Posted
+ Start a Discussion
Jonathan Wolff 7Jonathan Wolff 7 

add View all button to Task component

Hi, I build a Task component:User-added image
I would like to add the view all button to my component.
It should do the same like the view all button in the standart component.
Could you give me help how to do it?
VinayVinay (Salesforce Developers) 
Hi Jonathan,

Check below example that can help you to  Add View All button in lightning. 

https://www.infallibletechie.com/2018/07/adding-view-all-button-in.html

Thanks,
Suraj Tripathi 47Suraj Tripathi 47
Sample Code:
Component: 
<aura:component implements="force:appHostable"
       controller="AccountListController">
                
    <aura:attribute type="Account[]" name="acctList"/>
    <aura:attribute name="mycolumns" type="List"/>
    <aura:attribute name="viewAllBool" type="Boolean" default="true"/>
    
    <aura:handler name="init" value="{!this}" action="{!c.init}"/>
    
    <div class="slds-box slds-theme_default">
        
        <lightning:datatable data="{! v.acctList }" 
                             columns="{! v.mycolumns }" 
                             keyField="id"
                             hideCheckboxColumn="true"/>
        
        <br/>
        
        <aura:if isTrue="{!v.viewAllBool}">
            
            <div>
                
                <center><lightning:button label="View All" title="Neutral action" onclick="{! c.loadAll }"/></center>
                
            </div>
            
        </aura:if>
        
    </div>
    
</aura:component>
Controller: 
({
    
    init : function(component, event, helper) {
        
        component.set('v.mycolumns', [
            {label: 'Account Name', fieldName: 'linkName', type: 'url', 
            typeAttributes: {label: { fieldName: 'Name' }, target: '_blank'}},
 {label: 'Industry', fieldName: 'Industry', type: 'text'},
            {label: 'Type', fieldName: 'Type', type: 'Text'}
        ]);
        
        helper.fetchAccounts(component, event, 3);
        
    },
    loadAll : function(component, event, helper) {
        
        component.set("v.viewAllBool", false);
        helper.fetchAccounts(component, event, 100);
        
    }

})

Helper: 
({
    
 fetchAccounts : function(component, event, intLimit) {
  
        var action = component.get("c.fetchAccts");
        action.setParams({
            
            "intLimit" : intLimit
            
        });
        
        action.setCallback(this, function(response) {
            
            var state = response.getState();
            
            if (state === "SUCCESS") {
                
                var records = response.getReturnValue();
                records.forEach(function(record){
                    record.linkName = '/'+record.Id;
                });   
                
                component.set("v.acctList", records);
                
            }            
            
        });
        
        $A.enqueueAction(action);
        
 }
    
})
Apex Class: 
public class AccountListController {
    
    @AuraEnabled
    public static List < Account > fetchAccts(Integer intLimit) {
        
        return [ SELECT Id, Name, Industry, Type FROM Account LIMIT : Integer.valueOf(intLimit) ];
        
    }
    
}

If You find this as usefull please mark it as a Best Answer.
Thanks and Regards
Suraj Tripathi.