ig.GridExcelExporter
Code Sample
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <title>GridExcelExporter</title> <!-- Infragistics Combined CSS --> <link href="css/themes/infragistics/infragistics.theme.css" rel="stylesheet" type="text/css" /> <link href="css/structure/infragistics.css" rel="stylesheet" type="text/css" /> <!-- jQuery Core and jQuery UI --> <script type="text/javascript" src="http://code.jquery.com/jquery-1.9.1.min.js"></script> <script type="text/javascript" src="http://code.jquery.com/ui/1.10.3/jquery-ui.min.js"></script> <!-- Infragistics Combined Scripts --> <script src="js/infragistics.core.js" type="text/javascript"></script> <script src="js/infragistics.lob.js" type="text/javascript"></script> <!-- Required for igGridExcelExporter --> <script type="text/javascript" src="/js/modules/infragistics.documents.core.js"></script> <script type="text/javascript" src="/js/modules/infragistics.excel.js"></script> <script type="text/javascript" src="/js/modules/infragistics.gridexcelexporter.js"></script> <!-- External files for exporting --> <script src="http://www.igniteui.com/js/external/FileSaver.js"></script> <script src="http://www.igniteui.com/js/external/Blob.js"></script> </head> <body> <table id="grid"></table> <script type="text/javascript"> $(function () { $("#grid").igGrid({ columns: [ { key: "ProductID", headerText: "Product ID" }, { key: "Name", headerText: "Name" }, { key: "ProductNumber", headerText: "Product number" }, { key: "SafetyStockLevel", headerText: "Safety stock level" } ], autoGenerateColumns: false, primaryKey: "ProductID", dataSource: [ { "ProductID": 1, "Name": "Adjustable Race", "ProductNumber": "AR-5381", "SafetyStockLevel": 1000 }, { "ProductID": 2, "Name": "Bearing Ball", "ProductNumber": "BA-8327", "SafetyStockLevel": 1000 }, { "ProductID": 3, "Name": "BB Ball Bearing", "ProductNumber": "BE-2349", "SafetyStockLevel": 800 }, { "ProductID": 4, "Name": "Headset Ball Bearings", "ProductNumber": "BE-2908", "SafetyStockLevel": 800 }, { "ProductID": 316, "Name": "Blade", "ProductNumber": "BL-2036", "SafetyStockLevel": 800 }, { "ProductID": 317, "Name": "LL Crankarm", "ProductNumber": "CA-5965", "SafetyStockLevel": 500 }, { "ProductID": 318, "Name": "ML Crankarm", "ProductNumber": "CA-6738", "SafetyStockLevel": 500 }, { "ProductID": 319, "Name": "HL Crankarm", "ProductNumber": "CA-7457", "SafetyStockLevel": 500 }, { "ProductID": 320, "Name": "Chainring Bolts", "ProductNumber": "CB-2903", "SafetyStockLevel": 1000 }, { "ProductID": 321, "Name": "Chainring Nut", "ProductNumber": "CN-6137", "SafetyStockLevel": 1000 } ], width: "500px", }); $.ig.GridExcelExporter.exportGrid($("#grid") { fileName: "igGrid" }); }) </script> </body> </html>
Related Samples
- Export Basic Grid to Excel
- Exporting Grid to Excel with Features
- Customizing Grid Excel Export
- Exporting Grid to Excel with Progress Indicator
Related Topics
Dependencies
-
callbacks
- Type:
- object
- Default:
- {}
Callback for the exporter events.
-
cellExported
- Type:
- function
- Default:
- null
A function to call after the cell is exported.
Function takes arguments sender and args.
Use args.columnKey to get the igGrid column key of the cell.
Use args.columnIndex to get the igGrid column index of the cell.
Use args.cellValue to get the igGrid cell value.
Use args.rowId to get key or index of row.
Use args.xlRow to get reference to the worksheet row.
Use args.grid to get reference to the igGrid widget.Code Sample
$.ig.GridExcelExporter.exportGrid($(".selector"), {}, { cellExported: function(sender, args) {...} });
-
cellExporting
- Type:
- function
- Default:
- null
Cancel="true" A function to call before the cell is exported.
Function takes arguments sender and args.
Use args.columnKey to get the igGrid column key of the cell.
Use args.columnIndex to get the igGrid column index of the cell.
Use args.cellValue to get or set the igGrid cell value.
Use args.rowId to get key or index of row.
Use args.xlRow to get reference to the worksheet row.
Use args.grid to get reference to the igGrid widget.
Return false in order to cancel exporting the cell.Code Sample
$.ig.GridExcelExporter.exportGrid($(".selector"), {}, { cellExporting: function(sender, args) {...} });
-
error
- Type:
- function
- Default:
- null
A function to call when exporting fails.
Use error to obtain reference of the error object.Code Sample
$.ig.GridExcelExporter.exportGrid($(".selector"), {}, { error: function(error) {...} });
-
exportEnding
- Type:
- function
- Default:
- null
A function to call before the Excel file is downloaded.
Function takes arguments sender and args.
Use args.grid to get reference to the igGrid widget.
Use args.workbook to get reference to the Excel workbook.
Use args.worksheet to get reference to the Excel worksheet.
Return false in order to cancel downloading the file.Code Sample
$.ig.GridExcelExporter.exportGrid($(".selector"), {}, { exportEnding: function(sender, args) {...} });
-
exportStarting
- Type:
- function
- Default:
- null
Cancel="true" A function to call before exporting starts.
Function takes arguments sender and args.
Use args.grid to get reference to igGrid widget.
Return false in order to cancel exporting.Code Sample
$.ig.GridExcelExporter.exportGrid($(".selector"), {}, { exportStarting: function(sender, args) {...} });
-
headerCellExported
- Type:
- function
- Default:
- null
A function to call after a header cell is exported.
Function takes arguments sender and args.
Use args.headerText to get the igGrid column header text.
Use args.columnKey to get the igGrid column key.
Use args.columnIndex to get the igGrid column index.Code Sample
$.ig.GridExcelExporter.exportGrid($(".selector"), {}, { headerCellExported: function(sender, args) {...} });
-
headerCellExporting
- Type:
- function
- Default:
- null
A function to call before the header cell is exported.
Function takes arguments sender and args.
Use args.headerText to get or set the igGrid column header text.
Use args.columnKey to get the igGrid column key.
Use args.columnIndex to get the igGrid column index.
Return false in order to cancel exporting the cell.Code Sample
$.ig.GridExcelExporter.exportGrid($(".selector"), {}, { headerCellExporting: function(sender, args) {...} });
-
rowExported
- Type:
- function
- Default:
- null
Cancel="true" A function to call after the row is exported.
Function takes arguments sender and args.
Use args.rowId to get key or index of row.
Use args.element to get row TR element.
Use args.xlRow to get reference to the worksheet row.
Use args.grid to get reference to the igGrid widget.
Note: When exporting igHierarchicalGrid this callback is available only for the root grid rows.Code Sample
$.ig.GridExcelExporter.exportGrid($(".selector"), {}, { rowExported: function(sender, args) {...} });
-
rowExporting
- Type:
- function
- Default:
- null
A function to call before the row is exported.
Function takes arguments sender and args.
Use args.rowId to get key or index of row.
Use args.element to get row TR element.
Use args.xlRow to get reference to the worksheet row.
Use args.grid to get reference to the igGrid widget.
Return false in order to cancel exporting the row.
Note: When exporting igHierarchicalGrid this callback is available only for the root grid rows.Code Sample
$.ig.GridExcelExporter.exportGrid($(".selector"), {}, { rowExporting: function(sender, args) {...} });
-
success
- Type:
- function
- Default:
- null
A function to call when saving the file succeeds.
Use data to get the reference of saved object.Code Sample
$.ig.GridExcelExporter.exportGrid($(".selector"), {}, { success: function(sender, data) {...} });
-
summaryExported
- Type:
- function
- Default:
- null
A function to call after the summary is exported.
Function takes arguments sender and args.
Use args.headerText to get the igGrid column header text.
Use args.columnKey to get the igGrid column key.
Use args.columnIndex to get the igGrid column index.
Use args.summary to get a reference to the summary object.
Use args.xlRowIndex to get the Excel worksheet row index.Code Sample
$.ig.GridExcelExporter.exportGrid($(".selector"), {}, { summaryExported: function(sender, args) {...} });
-
summaryExporting
- Type:
- function
- Default:
- null
A function to call before the summary is exported.
Function takes arguments sender and args.
Use args.headerText to get the igGrid column header text.
Use args.columnKey to get the igGrid column key.
Use args.columnIndex to get the igGrid column index.
Use args.summary to get a reference to the summary object.
Use args.xlRowIndex to get reference to worksheet row index.
Return false in order to cancel exporting the summary.Code Sample
$.ig.GridExcelExporter.exportGrid($(".selector"), {}, { summaryExporting: function(sender, args) {...} });
-
settings
- Type:
- object
- Default:
- {}
The Infragistics Grid Excel exporter client-side component is implemented as a class, and exports the igGrid control with the columnfixing, filtering, hiding, paging, sorting, and summaries features.
-
columnsToSkip
- Type:
- array
- Default:
- []
- Elements Type:
- object
An array of strings containing the keys for the columns that will not be exported.
Code Sample
var exp = new $.ig.GridExcelExporter(); exp.exportGrid($(".selector"), { // The keys of the columns that will not be exported columnsToSkip: ["column1", "column2", "column3"] });
-
dataExportMode
- Type:
- enumeration
- Default:
- allRows
Indicates whether all sublevel data will be exported, or only data under expanded rows.
Members
- allRows
- Type:string
- All sublevel data will be exported.
- expandedRows
- Type:string
- Only data under expanded rows will be exported.
Code Sample
var exp = new $.ig.GridExcelExporter(); exp.exportGrid($(".selector"), { //Setting the dataExportMode option dataExportMode: "expandedRows", });
-
fileName
- Type:
- string
- Default:
- "document"
Specifies the name of the excel file that will be generated.
Code Sample
var exp = new $.ig.GridExcelExporter(); exp.exportGrid($(".selector"), { //Setting the file name fileName: "Document", });
-
gridFeatureOptions
- Type:
- object
- Default:
- {}
List of export settings which can be used with Grid Excel exporter.
-
columnfixing
- Type:
- enumeration
- Default:
- none
Indicates whether fixed columns will be applied in the exported table. This is set to none by default, but will change to applied if column fixing feature is defined in the igGrid.
Members
- none
- Type:string
- No column fixing will be applied in the excel document.
- applied
- Type:string
- Column fixing will be applied in the excel document.
Code Sample
var exp = new $.ig.GridExcelExporter(); exp.exportGrid($(".selector"), { gridFeatureOptions: { // Exports without columnFixing enabled in the excel document columnFixing: "none" } });
-
filtering
- Type:
- enumeration
- Default:
- none
Indicates whether filtering will be applied in the exported table. this is set to none by default, but will change to applied if filtering feature is defined in the igGrid.
Members
- none
- Type:string
- No filtering will be applied in the excel document.
- applied
- Type:string
- Filtering will be applied in the excel document.
- filteredRowsOnly
- Type:string
- Filtering will be exported in the excel document.
Code Sample
var exp = new $.ig.GridExcelExporter(); exp.exportGrid($(".selector"), { gridFeatureOptions: { // Exports without filtering enabled in the excel document filtering: "none" } });
-
hiding
- Type:
- enumeration
- Default:
- none
Indicates whether hidden columns will be removed from the exported table. This is set to none by default, but will change to applied if hiding feature is defined in the igGrid.
Members
- none
- Type:string
- All hidden columns will be exported to the excel document.
- applied
- Type:string
- Hidden columns will be exported as hidden in the excel document.
- visibleColumnsOnly
- Type:string
- Only visible columns will be exported.
Code Sample
var exp = new $.ig.GridExcelExporter(); exp.exportGrid($(".selector"), { gridFeatureOptions: { // No columns will be hidden in the excel document hiding: "none" } });
-
paging
- Type:
- enumeration
- Default:
- allRows
Indicates whether the rows on the current page or entire data will exported.
Members
- currentPage
- Type:string
- Only current page will be exported to the excel document.
- allRows
- Type:string
- All pages will be exported to the excel document.
Code Sample
var exp = new $.ig.GridExcelExporter(); exp.exportGrid($(".selector"), { gridFeatureOptions: { // Exports the currentPage in the excel document paging: "currentPage" } });
-
sorting
- Type:
- enumeration
- Default:
- none
Indicates whether sorting will be applied in the exported table. This is set_ to none by default, but will change to applied if sorting feature is defined in the igGrid.
Members
- none
- Type:string
- No sorting will be applied in the excel document.
- applied
- Type:string
- Sorting will be applied in the excel document.
Code Sample
var exp = new $.ig.GridExcelExporter(); exp.exportGrid($(".selector"), { gridFeatureOptions: { // No sorting will be applied to the excel document sorting: "none" } });
-
summaries
- Type:
- enumeration
- Default:
- none
Indicates whether summaries will be added in the exported table. This is set to none by default, but will change to applied if summaries feature is defined in the igGrid.
Members
- none
- Type:string
- No summaries will be exported to the excel document.
- applied
- Type:string
- Summaries will be exported to the excel document.
Code Sample
var exp = new $.ig.GridExcelExporter(); exp.exportGrid($(".selector"), { gridFeatureOptions: { // No summaries will be applied to the excel document summaries: "none" } });
-
gridStyling
- Type:
- enumeration
- Default:
- applied
Indicates whether excel table styles will be the same as grid styles. This is set to applied by default. Custom grid themes are not supported.
Members
- none
- Type:string
- The styles from the grid are not applied to the table region.
- applied
- Type:string
- The styles from the grid are applied to the table region.
Code Sample
var exp = new $.ig.GridExcelExporter(); exp.exportGrid($(".selector"), { // Grid style will be exported to the excel table gridStyling: "applied" });
-
skipFilteringOn
- Type:
- array
- Default:
- []
- Elements Type:
- object
List of strings containing the keys for the worksheet columns which will not be applied any filtering.
Code Sample
var exp = new $.ig.GridExcelExporter(); exp.exportGrid($(".selector"), { // The keys of columns that filtering will skip skipFilteringOn: ["column1", "column2", "column3"], });
-
tableStyle
- Type:
- string
- Default:
- "TableStyleMedium1"
Specifies the excel table style region. The following table styles are available:
TableStyleMedium[1-28]
TableStyleLight[1-21]
TableStyleDark[1-11].Code Sample
var exp = new $.ig.GridExcelExporter(); exp.exportGrid($(".selector"), { gridStyling: "none", //Setting the table style to TableStyleDark tableStyle: "TableStyleDark2" });
-
worksheetName
- Type:
- string
- Default:
- "Sheet1"
Specifies the worksheet name where the igGrid will be exported.
Code Sample
var exp = new $.ig.GridExcelExporter(); exp.exportGrid($(".selector"), { //Setting the name of the worksheet worksheetName: "Worksheet1", });
-
ig.GridExcelExporter
Constructor- new $.ig.GridExcelExporter( );
-
exportGrid
- .exportGrid( grid:object, userSettings:object, userCallbacks:object );
Exports the provided igGrid to Excel document.
- grid
- Type:object
- jQuery element of the igGrid.
- userSettings
- Type:object
- Settings for exporting the grid.
- userCallbacks
- Type:object
- Callbacks for the events.
Code Sample
var exp = new $.ig.GridExcelExporter(); exp.exportGrid($(".selector"), { fileName: "igGrid", gridFeatureOptions: {"sorting": "applied", "filtering": "applied", "paging": "currentPage"} });