+ Start a Discussion
Chhavi Jain 15Chhavi Jain 15 

getting below error even we have records.

This page has an error. You might just need to refresh it. Action failed: c:csvSample$controller$loadContactList [component is not defined] Failing descriptor: {c:csvSample$controller$loadContactList}
Best Answer chosen by Chhavi Jain 15
Team Codekiat.comTeam Codekiat.com
Here is the issue onLoad : function(componenet, event) change this to onLoad : function(component, event)

Naveen
Team codengine.in

All Answers

Team Codekiat.comTeam Codekiat.com
Hi Chhavi, This is a generic error thrown in the lightning components. can you paste component and controller code here so that we can take a look.

Naveen
 
Raj VakatiRaj Vakati
Looks like some where in the code you defined component  and some where cmp .. please make sure all your refernces are pointed to cmp or component .. 
Chhavi Jain 15Chhavi Jain 15
<aura:component controller="csvDownloadCtrl" access="global">
    <aura:handler name = "init" value="{!this}" action="{!c.loadContactList}"/>
    <aura:attribute name="ListOfContact" type="contact[]" default="{'sobjectType' : 'contact'}"/>
    <div class="slds-m-around--xx-large">
    <button class="slds-button slds-button--brand" onclick="{!c.downloadCsv}">Download As CSV</button>
        <br/><br/>
        <table class="slds-table slds-table--bordered slds-table--cell-buffer">
        <thead>
            <tr class="slds-text-title--caps">
            <th class="slds-is-sortable slds-text-title--caps" scope="col">
                <span class="slds-truncate" title="Name">First Name</span>
                </th>
                 <th class="slds-is-sortable slds-text-title--caps" scope="col">
                <span class="slds-truncate" title="Name">Last Name</span>
                </th>
                 <th class="slds-is-sortable slds-text-title--caps" scope="col">
                <span class="slds-truncate" title="Name">Department</span>
                </th>
                 <th class="slds-is-sortable slds-text-title--caps" scope="col">
                <span class="slds-truncate" title="Name">Mobile Phone</span>
                </th>
            </tr>
            </thead>
            <tbody>
            <aura:iteration items="{!v.ListOfContact}" var="con">
                <tr>
                <th scope="row">
                    <div class="slds-truncate" title="{!con.FirstName}">{!con.FirstName}</div>
                    </th>
                    <th scope="row">
                    <div class="slds-truncate" title="{!con.Firstname}">{!con.LastName}</div>
                    </th>
                    <th scope="row">
                    <div class="slds-truncate" title="{!con.Firstname}">{!con.Department}</div>
                    </th>
                    <th scope="row">
                    <div class="slds-truncate" title="{!con.Firstname}">{!con.MobilePhone}</div>
                    </th>
                </tr>
                </aura:iteration>
            </tbody>
        </table>
    </div>
</aura:component>


===========================================================================================================

public class csvDownloadCtrl {
    @AuraEnabled
    public static list<contact> fetchContact()
    {
        List<contact> returnConList = new List<contact>();
        for(contact con : [Select firstName, lastName, Department, Mobilephone from contact])
        {
            returnConList.add(con);
            System.debug('====' +returnConList);
        }
        return returnConList;
    }

============================================================================================================

({
 loadContactList : function(component, event, helper) {
        console.log("loading");
  helper.onLoad(component, event);
        console.log("successfully loading");
 },
   
    downloadCsv : function(component, event, helper)
    {
        var stockData = component.get('v.ListOfContact');
        var csv = helper.convertArrayOfObjectsToCSV(component, stockData);
        if(csv == null)
        {
            return;
        }
        var hiddenElement =document.createElement('a');
        hiddenElement.href = 'data:text/csv;charset=utf-8,' +encodeURI(csv);
        hiddenElement.target = '_self';
        hiddenElement.download = 'ExportData.csv';
        document.body.appendChild(hiddenElement);
        hiddenElement.click();
    }
})


==============================================================================================================
({
 onLoad : function(componenet, event)
    {
        var action = component.get('c.fetchContact');
        action.setCallback(this, function(response)
                           {
                               var state = response.getState();
                               if(state == "SUCCESS")
                               {
                                   component.set('v.ListOfContact', response.getReturnValue());
                                   console.log('===');
                               }
                           });
  $A.enqueueAction(action);
 },
    convertArrayOfObjectsToCSV : function(component, objectRecords)
    {
        var csvStringResult, counter, keys, columnDivider, lineDivider;
        if(objectRecords == null || !objectRecords.length)
        {
            return null;
        }
        columnDivider = ',';
        lineDivider = '\n';
        keys = ['FirstName', 'LastName', 'Department', 'MobilePhone'];
        csvStringResult = '';
        csvStringResult += keys.join(columnDivider);
        csvStringResult += keys.join(lineDivider);
        for(var i = 0; i<objectRecords.length; i++)
        {
            counter = 0;
            for(var sTempKey in keys)
            {
               
                var skey =keys[sTempKey];
               
                if(counter > 0)
                {
                    csvStringResult += columnDivider;
                   
                }
               
                csvStringResult += '"'+objectRecords[i][skey]+'"';
               
                counter++;
            }
            csvStringResult += lineDivider;
        }
        return csvStringResult;
    },
})
Team Codekiat.comTeam Codekiat.com
Here is the issue onLoad : function(componenet, event) change this to onLoad : function(component, event)

Naveen
Team codengine.in
This was selected as the best answer
Chhavi Jain 15Chhavi Jain 15
Hi Naveen, Thank you so much for your reply. Its working now. Thanks, Chhavi
Team Codekiat.comTeam Codekiat.com
Thanks for the update. 

Happy coding!
Team codengine.in 
Chhavi Jain 15Chhavi Jain 15
Hi Naveen, This code is working only on chrome but not working with Firefox and IE. Can you help me on this issue?
Chhavi Jain 15Chhavi Jain 15
Hi, Actually working on firefox also but not in Edge.
Team Codekiat.comTeam Codekiat.com
I think some of the things will not work in Edge as salesforce doesn't support the browser. Please find supported browsers at https://help.salesforce.com/articleView?id=getstart_browser_overview.htm&type=5

Naveen