2

I want to export data fom lightning datatable into Excel file

JS :

exportData(){
    let rowEnd = '\n';
    let csvString = '';
    let rowData = new Set();
    // getting keys from data
    this.cases.forEach(function (record) {
        Object.keys(record).forEach(function (key) {
            rowData.add(key);

        });
    });
    // Array.from() method returns an Array object from any object with a length property or an iterable object.
    rowData = Array.from(rowData);
    rowData.splice(0,2);
    console.log('rowData0000',rowData);
    // splitting using ','
    csvString += rowData.join(',');
    csvString += rowEnd;

    // main for loop to get the data based on key value
    for(let i=0; i < this.cases.length; i++){
        let colValue = 0;
        for(let key in rowData) {
            if(rowData.hasOwnProperty(key)) {
                let rowKey = rowData[key];

                // add , after every value except the first.
                if(colValue > 0){
                    csvString += ',';
                }
                // If the column is undefined, it as blank in the CSV file.
                let value = this.cases[i][rowKey] === undefined ? '' : this.cases[i][rowKey];
                csvString += '"'+ value +'"';
                colValue++;
            }
        }
        csvString += rowEnd;
    }


    let downloadElement = document.createElement('a');

    // This  encodeURI encodes special characters, except: , / ? : @ & = + $ # (Use encodeURIComponent() to encode these characters).
    downloadElement.href = 'data:text/csv;charset=utf-8,' + encodeURI(csvString);
    downloadElement.target = '_self';
    downloadElement.download = 'SalesforceExport.csv';
    document.body.appendChild(downloadElement);
    downloadElement.click(); 
}


 @track columns = [
        {label: 'NUMERO DE LA REQUETE', fieldName: 'CaseNumberURL',type: 'url',typeAttributes: {label: { fieldName: 'CaseNumber' }, target: '_blank'},sortable: true},
        {label: 'OBJET',fieldName: 'Subject',type: 'text',sortable: true},
        {label: 'STATUS',fieldName: 'Status',type: 'Picklist',sortable: true},
        {label: 'INTERACTION CLIENT',fieldName: 'Interaction_client__c',type: 'Picklist',sortable: true},
        {label: 'DATE D\'OUVERTURE',fieldName: 'Date_ouverture__c',type: 'Date',sortable: true},
        {label: 'NOM DU CONTACT',fieldName: 'ContactIdURL',type: 'url',typeAttributes: {label: { fieldName: 'ContactId' }, target: '_blank'},sortable: true},
        {label: 'PRIORITE',fieldName: 'Priority',type: 'Picklist',sortable: true},
        {label: 'Type',fieldName: 'Type',type: 'Picklist',sortable: true},
        {label: 'PRODUIT',fieldName: 'Produit__c',type: 'Picklist',sortable: true},
        {label: 'ENVIRONNEMENT',fieldName: 'Environnement__c',type: 'Picklist',sortable: true},
        {label: 'SITE CONCERNE',fieldName: 'SiteForPortal__c',type: 'Formula',sortable: true},
        {label: 'DEVELOPPEMENT',fieldName: 'Developpement__c',type: 'Formula',sortable: true},
        {label: 'CORRECTIONS & REPORTS',fieldName: 'CorrectionsReports__c',type: 'Formula',sortable: true},
        {label: 'NOM COMPLET DU PROPRIETAIRE',fieldName: 'Nom_du_groupement__c',type: 'Formula',sortable: true},
        {label: 'DATE/HEURE DE FERMETURE',fieldName: 'Date_fermeture__c',type: 'Date',sortable: true}
        ];

The column show the Api name of column but i want to display it's label

enter image description here

is they any way to better change the look of file? as you see the columns aren't showing correctly ..

Improve this question
1

1 Answer 1

Reset to default
1

I believe you should go through the columns first.

// add columns
const columnsLabels = this.columns.map(column => column.label);

csvString += columnsLabels.join(',');
csvString += rowEnd;

// add row data
this.cases.forEach(record => {
   const rowData = this.columns.map(column => record[column.fieldName]);
   csvString += rowData.join(',');
   csvString += this.rowEnd;
})
Improve this answer
5
  • Thanks , it works ! i didn't delete the loop of record key iteration because it contains the values .. do you know how to better change the look of csv file?
    – user110654
    Sep 3, 2022 at 10:57
  • I will edit my comment and give you a solution.
    – Piotr Gajek
    Sep 3, 2022 at 10:58
  • @Fabien check my edited comment. :)
    – Piotr Gajek
    Sep 3, 2022 at 11:06
  • the syntax isn't correct , but thanks anyway
    – user110654
    Sep 3, 2022 at 11:12
  • I'm blocked from posting new questions since 2 weeks ago , my questions seems clear and it respects the site's politics - should i wait for some more time? Piotr
    – user110654
    Sep 28, 2022 at 7:50

You must log in to answer this question.