How to export ui-grid to excel file?

Question

I am using ui-grid in my project with angular.

In my project, ui-grid exports the contents to an excel file and works fine.

Here is the ui-grid declaration:

and here is the definition of ui-grid in javascript:

$scope.gridOptions = { columnDefs: [ { field: 'name' }, { field: 'company', cellFilter: 'mapCompany:this.grid.appScope.companyCatalog' } ], enableGridMenu: true, enableSelectAll: true, exporterCsvFilename: 'myFile.csv', exporterPdfDefaultStyle: {fontSize: 9}, exporterPdfTableStyle: {margin: [30, 30, 30, 30]}, exporterPdfTableHeaderStyle: {fontSize: 10, bold: true, italics: true, color: 'red'}, exporterPdfHeader: { text: "My Header", style: 'headerStyle' }, exporterPdfFooter: function ( currentPage, pageCount ) { return { text: currentPage.toString() + ' of ' + pageCount.toString(), style: 'footerStyle' }; }, exporterPdfCustomFormatter: function ( docDefinition ) { docDefinition.styles.headerStyle = { fontSize: 22, bold: true }; docDefinition.styles.footerStyle = { fontSize: 10, bold: true }; return docDefinition; }, exporterPdfOrientation: 'portrait', exporterPdfPageSize: 'LETTER', exporterPdfMaxGridWidth: 500, exporterCsvLinkElement: angular.element(document.querySelectorAll(".custom-csv-link-location")), data : [ { "name": "Derek", "company": 423638 }, { "name": "Frederik", "company": 513560 } ], onRegisterApi: function(gridApi){ $scope.gridApi = gridApi; }, gridMenuCustomItems: [ { title:'Custom Export', action: function ($event) { // this.grid.api.exporter.csvExport( uiGridExporterConstants.ALL, uiGridExporterConstants.ALL, true ); var exportData = uiGridExporterService.getData(this.grid, uiGridExporterConstants.ALL, uiGridExporterConstants.ALL, true); var csvContent = uiGridExporterService.formatAsCsv([], exportData, this.grid.options.exporterCsvColumnSeparator); uiGridExporterService.downloadFile (this.grid.options.exporterCsvFilename, csvContent, this.grid.options.exporterOlderExcelCompatibility); }, order:0 } ] }; 

Here is the work of PLUNKER !

But I need to export the contents to an RTcel excel file.

My question is, how can I export the contents of the ui-grid to an excel RTL file?

Answer 1

You have two options. You can use the built-in menu that I just did successfully on a demo from UIGrid or you can add ui.grid.exporter to another module

From the documentation:

This module provides the ability to export data from the network. Data can be exported in various formats, and all data, visible data, or selected rows can be exported with all columns or visible columns. no user interface provided, the caller must provide their own user interfaces / buttons as or enable gridMenu

I used the built-in gridMenu, which downloaded a file without an extension called undefined. I was able to open it, as from LibreOffice Calc.

If you need more control, depending on your use case, use the exporter function. The exporter function allows you to export data from the grid in csv or pdf format. The exporter can export all data, visible data or selected data.

If you want to export Excel, you need to install the Excel-Builder module, available through: bower install excelbuilder.

However, you leave a lot to your question. The user can set the RTL or LTR parameters in excel mode, depending on the version. To do this, the code will require another library or program. Several years ago I programmed a lot of MS Word and Excel using Visual Basic.

I want to say, you need to specify the version of excel, do you want to change the file programmatically, do you send the file somewhere or download it and then open it with excel? etc. I need more details for your use case.

Answer 2

I have changed code in plunker please check this

Plunker