Exporting Data

In UI Editor, you can export your data by using two Quick methods: Download and XLSX Export.

How to Download?

To download any file, the file needs to have a base64 type string value. The download process can be started by giving this variable and the file name as a parameter to the Quick.download method to be downloaded.

quick.Quick.download({data: base64, name: string})

Example file: Download

How to Export To XLSX and CSV?

You can use Quick.exportToXlsx method to export your specific data to Excel or Comma-Separated-Values(CSV) file.

To create a single sheet:

quick.Quick.exportToXlsx({fileName: string, bookType?: "xlsx" | "csv", items: Array, headers: Array, sheetName?: string})

To create multiple sheets:

quick.Quick.exportToXlsx({ fileName: string, bookType?: "xlsx" | "csv", sheetList: Array<{items: Array, headers: Array, sheetName?: string}> })

Params

• fileName: string -> Name for the file without extension.

• bookType?: "xlsx" | "csv" -> Type of generated workbook. It is optional. If it is not set, its default value is "xlsx".

• sheetList: Array<IExcelSheet> -> Array of sheet's info. Used to create multiple sheets in Excel.

  [{ headers: Array<object> | Array<IExcelHeader>, items: Array<object>, sheetName?: string }] 

• items: Array<object> -> Array of items to export

• headers: Array<object> | Array<IExcelHeader> -> Array of headers for cell header. The array of instances have to contains value, text and optional cellOptions props like.

  Examples of headers usage are found below:

  [{value='fat', text='Fat (g)'}]" 

  [{ text: "Tutar", value: "amount", cellOptions: 
  { type: ExcelCellType.number, numberFormat: "##,#0.00" } }]

• sheetName?: string -> Name of the inserted worksheet. If not, it is called Sheet1 by default.

  IExcelHeader {
     text: string,
     value:string,
     cellOptions?:IExcelCellOptions
  }
  
  IExcelCellOptions {
     type: ExcelCellType, 
     numberFormat?:string,
  }
  
  enum ExcelCellType {
     boolean = "b",
     number = "n",
     date = "d",
     text = "s",
  }

How to Create Single Sheet?

quick.Quick.exportToXlsx({fileName: string, bookType?: "xlsx" | "csv", items: Array, headers: Array, sheetName?: string})

quick.Quick.exportToXlsx({fileName:'test', items:dataTable.items, headers:dataTable.headers, sheetName:'myPage'})

quick.Quick.exportToXlsx({fileName:'test', bookType:'csv', items:dataTable.items, headers:dataTable.headers, sheetName:'myPage'})

You can use the following usage instead of the one above.

let headers = [{value:'name', text:'Name'}, {value:'fat', text:'Fat (g)'}]
quick.Quick.exportToXlsx({fileName:'test', items: component.datatable.items, headers:headers, sheetName:'myPage'})

let headers = [{value:'name', text:'Name'}, {value:'fat', text:'Fat (g)'}]
quick.Quick.exportToXlsx({fileName:'test', bookType:'csv', items: component.datatable.items, headers:headers, sheetName:'myPage'})

An example of exporting object child member variables to Excel is available below.

let items: object[] = [
 { fat: { a1: { a: "aa1" } }, bat: "b1" },
 { fat: { a1: { a: "aa1" } }, bat: "b1" },
 { fat: { a1: { a: "aa1" } }, bat: "b1" },
 { fat: { a1: { a: "aa1" } }, bat: "b1" }
]
let headers: object[] = [{ value: 'fat.a1.a', text: 'Fat (g)' }, { value: 'bat', text: 'bat (g)' }];

quick.Quick.exportToXlsx({ fileName: "deneme", items, headers });

How to Create Multiple Sheets?

quick.Quick.exportToXlsx({ fileName: string, bookType?: "xlsx" | "csv", sheetList: [{ items: Array, headers: Array, sheetName?: string}] })

quick.Quick.exportToXlsx({
    fileName: "MyTable",
    sheetList: [
        { headers: components.myTable1.headers, items: components.myTable1.items, sheetName: "MySheet1" },
        { headers: components.myTable2.headers, items: components.myTable2.items, sheetName: "MySheet2" }
    ]
});

How to format information for amount fields?

Format information for amount fields is added to the exportToXlsx() method.

let listItems = [
    {
        amount: 0,
    },
    {
        amount: 730.00,
    },
    {
        amount: 22819.80,
    }
];

let headersItems: IExcelHeader[] = [
    { text: "Tutar", value: "amount", cellOptions: { type: ExcelCellType.number, numberFormat: "##,#0.00" } },
];

quick.Quick.exportToXlsx({ fileName: "mySampleExcel", items: listItems, headers: headersItems });

How to convert Excel and CSV file data into an array of JSON objects?

You can use Quick.xlsxToJson method to convert Excel and CSV data into an array of JSON objects.

danger

it is only available for Web usage.

info

For all features for XLSX.utils.sheet_to_json usage, click See More

quick.Quick.xlsxToJson(excelToJsonData: IExcelToJsonData) : IExcelJsonData[]

IExcelToJsonData { excelData: ArrayBuffer | string; options?: IExcelToJsonOptions; }

excelData : ArrayBuffer or base64String data of Excel and CSV file.
options : IExcelToJsonOptions { header?: "A"|number|string[]; range?: any; blankRows?: boolean; defaultValue?: any; raw?: boolean; rawNumbers?: boolean; dateFormat?: string | number; }

header : Output format
range : Override worksheet range
blankRows : Include or omit blank lines in the output
defaultValue : Default value for null/undefined values
raw : if true, return raw data; if false, return formatted text
rawNumbers : if true, return raw numbers; if false, return formatted numbers
dateFormat : Use specified date format

IExcelJsonData { sheetName?: string; sheetData?: any[][] | any[]; }

let base64StringData = 'data:application/vnd.openxmlformats-officedocument.spreadsheetml.sheet;base64,<DATA>';

let excelToJsonData: IExcelToJsonData = {
                excelData: base64StringData,
                options: {
                        header: 1,
                        raw: false
                }
        }

let excelJsonData = quick.Quick.xlsxToJson(excelToJsonData);

let arrayBufferData = <ArrayBuffer DATA>;

let excelToJsonData: IExcelToJsonData = {
                excelData: <ArrayBuffer>arrayBufferData,
                options: {
                        header: 1,
                        raw: false
                }
        }

let excelJsonData = quick.Quick.xlsxToJson(excelToJsonData);

Example Usage

exportToXlsx
xlsxToJson
xlsxToJson_Sample_ExcelFile.xlsx