igGrid export two grid in one excel different sheets
by georgianastasov
HTML
<script src="https://igniteui.com/js/modernizr.min.js"></script>
<script src="https://code.jquery.com/jquery-1.9.1.min.js"></script>
<script src="https://code.jquery.com/ui/1.10.3/jquery-ui.min.js"></script>
<script src="https://igniteui.com/js/external/FileSaver.js"></script>
<script src="https://igniteui.com/js/external/Blob.js"></script>
<script src="https://cdn-na.infragistics.com/igniteui/latest/js/infragistics.core.js"></script>
<script src="https://cdn-na.infragistics.com/igniteui/latest/js/infragistics.lob.js"></script>
<script src="https://cdn-na.infragistics.com/igniteui/latest/js/infragistics.excel-bundled.js"></script>
<script src="https://cdn-na.infragistics.com/igniteui/latest/js/modules/infragistics.gridexcelexporter.js"></script>
<link href="https://cdn-na.infragistics.com/igniteui/latest/css/themes/infragistics/infragistics.theme.css" rel="stylesheet"></link>
<link href="https://cdn-na.infragistics.com/igniteui/latest/css/structure/infragistics.css" rel="stylesheet"></link>
<p>Grid 1</p>
<table id="grid"></table><br />
<p>Grid 2</p>
<table id="grid2"></table><br />
<input type="button" id="exportButton" value="Export"></input>
JavaScript
$(function () {
$(function () {
//data set 1
var data = [
{ 'ProductID': 1, 'Name': 'Omnis ut illum nisi.', 'ProductNumber': 904 },
{ 'ProductID': 2, 'Name': 'Quis quibusdam qui.', 'ProductNumber': 905 },
{ 'ProductID': 3, 'Name': 'Sint laudantium et.', 'ProductNumber': 903 },
{ 'ProductID': 4, 'Name': 'Tempore eos.', 'ProductNumber': 902 },
{ 'ProductID': 5, 'Name': 'Maiores aut ducimus.', 'ProductNumber': 901 },
];
//data set 2
var data2 = [
{ 'ProductID': 'ALT', 'Name': 'Vel inventore.', 'ProductNumber': 105 },
{ 'ProductID': "TST", 'Name': 'Ut molestiae.', 'ProductNumber': 101 },
{ 'ProductID': "JKL", 'Name': 'Nihil magnam aut ut.', 'ProductNumber': 103 },
{ 'ProductID': "QWE", 'Name': 'Repellendus dolorum.', 'ProductNumber': 102 },
{ 'ProductID': "ZXC", 'Name': 'Odit ut quo minus.', 'ProductNumber': 100 },
];
//grid 1
$("#grid").igGrid({
autoGenerateColumns: false,
width: "100%",
height: "250px",
columns: [
{ key: "ProductID", headerText: "Product ID", dataType: "number" },
{ key: "Name", headerText: "Product Name", dataType: "string" },
{ key: "ProductNumber", headerText: "Product Number", dataType: "number" }
],
dataSource: data,
primaryKey: "ProductID"
});
//grid 2
$("#grid2").igGrid({
...