Skip to content

Commit a46800b

Browse files
damyanpetevdamyanpetev
authored
Merge pull request #10 from hanastasov/master
enhance documentation code samples for exporter
2 parents 677e185 + ea4f372 commit a46800b

4 files changed

Lines changed: 81 additions & 59 deletions

File tree

‎HTMLSamples/grid/export-basic-grid.html‎

Lines changed: 10 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -28,10 +28,7 @@
2828
$.ig.loader({
2929
scriptPath: "%%ignite-ui%%/js/",
3030
cssPath: "%%ignite-ui%%/css/",
31-
resources:'igGrid,' +
32-
'modules/infragistics.documents.core.js,' +
33-
'modules/infragistics.excel.js,' +
34-
'modules/infragistics.gridexcelexporter.js'
31+
resources:'igGrid,' + 'igGridExcelExporter'
3532
});
3633

3734
$.ig.loader(function () {
@@ -51,28 +48,30 @@
5148

5249
$("#grid").igGrid({
5350
autoGenerateColumns: false,
54-
width: "100%",
55-
height: "200px",
5651
columns: [
5752
{ key: "ProductID", headerText: "$$(ProductID)", width: "100px", dataType: "number" },
58-
{ key: "Name", headerText: "$$(Name)", width: "150px", dataType: "string" },
53+
{ key: "Name", headerText: "$$(Name)", width: "250px", dataType: "string" },
5954
{ key: "ProductNumber", headerText: "$$(ProductNumber)", width: "200px", dataType: "number" }
6055
],
6156
dataSource: data,
6257
primaryKey: "ProductID"
6358
});
6459

6560
$("#exportButton").on("click", function () {
66-
$.ig.GridExcelExporter.exportGrid($("#grid"), {
67-
fileName: "igGrid"
68-
});
61+
$.ig.GridExcelExporter.exportGrid(
62+
$('#grid'),
63+
{
64+
fileName: 'igGrid',
65+
worksheetName: 'Sheet1',
66+
}
67+
);
6968
});
7069
});
7170
});
7271
</script>
7372
</head>
7473
<body>
7574
<table id="grid"></table><br>
76-
<input type="button" id="exportButton" value="$$(Export_Excel_Button)"></input>
75+
<input type="button" id="exportButton" value="$$(Export_Excel_Button)"></input>
7776
</body>
7877
</html>

‎HTMLSamples/grid/export-client-events.html‎

Lines changed: 69 additions & 48 deletions
Original file line numberDiff line numberDiff line change
@@ -7,10 +7,28 @@
77
.right {
88
float: right;
99
}
10-
1110
#exportButton {
1211
float: left;
1312
}
13+
.exporting-overlay {
14+
position: absolute;
15+
background-color: rgba(181, 181, 181, 0.9);
16+
top: 0;
17+
left: 0;
18+
z-index: 100000;
19+
text-align: center;
20+
vertical-align: top;
21+
}
22+
.exporting-overlay:after {
23+
content: "";
24+
display: inline-block;
25+
vertical-align: middle;
26+
height: 100%;
27+
}
28+
.exporting-text {
29+
font-size: 46px;
30+
font-weight: bold;
31+
}
1432
</style>
1533
<!--Required scripts-->
1634
<script src="%%modernizr%%"></script>
@@ -28,91 +46,94 @@
2846
$.ig.loader({
2947
scriptPath: "%%ignite-ui%%/js/",
3048
cssPath: "%%ignite-ui%%/css/",
31-
resources: 'igGrid,' +
32-
'igGrid.Hiding,' +
33-
'igGrid.Filtering,' +
34-
'igGrid.Sorting,' +
35-
'igGrid.Paging,' +
36-
'igGrid.Summaries,' +
37-
'modules/infragistics.documents.core.js,' +
38-
'modules/infragistics.excel.js,' +
39-
'modules/infragistics.gridexcelexporter.js'
49+
resources: 'igGrid.Sorting.Filtering,' +
50+
'igGridExcelExporter'
4051
});
4152

4253
$.ig.loader(function () {
4354
var data = [
44-
{ 'ProductID': 1, 'Name': 'Omnis ut illum nisi.', 'ProductNumber': 2973311236, "InStock": true, "Quantity": 56, VendorWebsite: 'http://infragistics.com/', },
45-
{ 'ProductID': 2, 'Name': 'Quis quibusdam qui.', 'ProductNumber': 5907101619, "InStock": false, "Quantity": 0, VendorWebsite: 'http://infragistics.com/', },
46-
{ 'ProductID': 3, 'Name': 'Sint laudantium et.', 'ProductNumber': 3057803521, "InStock": true, "Quantity": 26, VendorWebsite: 'http://infragistics.com/' },
47-
{ 'ProductID': 17, 'Name': 'Tempore eos.', 'ProductNumber': 3576608248, "InStock": true, "Quantity": 8, VendorWebsite: 'http://infragistics.com/' },
48-
{ 'ProductID': 18, 'Name': 'Maiores aut ducimus.', 'ProductNumber': 7079645227, "InStock": true, "Quantity": 62, VendorWebsite: 'http://infragistics.com/' },
49-
{ 'ProductID': 19, 'Name': 'Vel inventore.', 'ProductNumber': 191484500, "InStock": true, "Quantity": 18, VendorWebsite: 'http://infragistics.com/' },
50-
{ 'ProductID': 20, 'Name': 'Ut molestiae.', 'ProductNumber': 2994899561, "InStock": false, "Quantity": 0, VendorWebsite: 'http://infragistics.com/' },
51-
{ 'ProductID': 31, 'Name': 'Nihil magnam aut ut.', 'ProductNumber': 5652753011, "InStock": true, "Quantity": 41, VendorWebsite: 'http://infragistics.com/' },
52-
{ 'ProductID': 32, 'Name': 'Repellendus dolorum.', 'ProductNumber': 8807902556, "InStock": true, "Quantity": 10, VendorWebsite: 'http://infragistics.com/' },
53-
{ 'ProductID': 43, 'Name': 'Odit ut quo minus.', 'ProductNumber': 1083007847, "InStock": false, "Quantity": 0, VendorWebsite: 'http://infragistics.com/' }
55+
{ 'Name': 'Omnis ut illum nisi.', 'ProductNumber': 2973311236, "InStock": true, "Quantity": 56, VendorWebsite: 'http://infragistics.com/', DeliveryDate: "07/25/2015" },
56+
{ 'Name': 'Quis quibusdam qui.', 'ProductNumber': 5907101619, "InStock": false, "Quantity": 0, VendorWebsite: 'http://infragistics.com/', DeliveryDate: "09/22/2014" },
57+
{ 'Name': 'Sint laudantium et.', 'ProductNumber': 3057803521, "InStock": true, "Quantity": 26, VendorWebsite: 'http://infragistics.com/', DeliveryDate: "08/13/2015" },
58+
{ 'Name': 'Tempore eos.', 'ProductNumber': 3576608248, "InStock": true, "Quantity": 8, VendorWebsite: 'http://infragistics.com/', DeliveryDate: "06/28/2014" },
59+
{ 'Name': 'Maiores aut ducimus.', 'ProductNumber': 7079645227, "InStock": true, "Quantity": 62, VendorWebsite: 'http://infragistics.com/', DeliveryDate: "04/19/2015" },
60+
{ 'Name': 'Vel inventore.', 'ProductNumber': 191484500, "InStock": true, "Quantity": 18, VendorWebsite: 'http://infragistics.com/', DeliveryDate: "07/21/2015" },
61+
{ 'Name': 'Ut molestiae.', 'ProductNumber': 2994899561, "InStock": false, "Quantity": 0, VendorWebsite: 'http://infragistics.com/', DeliveryDate: "03/10/2016" },
62+
{ 'Name': 'Nihil magnam aut ut.', 'ProductNumber': 5652753011, "InStock": true, "Quantity": 41, VendorWebsite: 'http://infragistics.com/', DeliveryDate: "07/25/2016" },
63+
{ 'Name': 'Repellendus dolorum.', 'ProductNumber': 8807902556, "InStock": true, "Quantity": 10, VendorWebsite: 'http://infragistics.com/', DeliveryDate: "09/01/2017" },
64+
{ 'Name': 'Odit ut quo minus.', 'ProductNumber': 1083007847, "InStock": false, "Quantity": 0, VendorWebsite: 'http://infragistics.com/', DeliveryDate: "11/10/2015" }
5465
];
5566

5667
$("#grid").igGrid({
5768
autoGenerateColumns: false,
5869
columns: [
59-
{ headerText: "$$(ProductID)", key: "ProductID", dataType: "number", width: "100px" },
6070
{ headerText: "$$(Name)", key: "Name", dataType: "string", width: "250px" },
6171
{ headerText: "$$(ProductNumber)", key: "ProductNumber", dataType: "number", width: "200px" },
6272
{ headerText: "$$(InStock)", key: "InStock", dataType: "bool", width: "150px" },
6373
{ headerText: "$$(Quantity)", key: "Quantity", dataType: "number", width: "150px" },
64-
{ headerText: "$$(Vendorwebsite)", key: "VendorWebsite", width: "220px", template: '<a href="${VendorWebsite}">${VendorWebsite}</a>' }
74+
{ headerText: "$$(Vendorwebsite)", key: "VendorWebsite", width: "220px", template: '<a href="${VendorWebsite}">${VendorWebsite}</a>' },
75+
{ headerText: "$$(DeliveryDate)", key: "DeliveryDate", dataType: "date", width: "200px" },
6576
],
6677
dataSource: data,
6778
width: "100%",
68-
primaryKey: "ProductID",
6979
features: [
70-
{
71-
name: "Filtering"
72-
},
73-
{
74-
name: "Sorting",
75-
},
76-
{
77-
name: "Paging",
78-
type: "local",
79-
pageSize: 10
80-
}]
80+
{
81+
name: "Filtering"
82+
},
83+
{
84+
name: "Sorting",
85+
}
86+
]
8187
});
8288

8389
$("#exportButton").on("click", function () {
90+
var exportingOverlay = $('<div>');
8491
$.ig.GridExcelExporter.exportGrid($("#grid"), {
8592
fileName: "igGrid",
86-
gridFeatureOptions: { "sorting": "applied", "filtering": "applied", paging: "currentPage", "summaries": "applied" },
93+
gridFeatureOptions: { sorting: "applied", filtering: "applied" },
8794
},
8895
{
89-
headerCellExported: function (e, args) {
90-
if (args.columnKey == "Quantity") {
91-
args.xlRow.setCellValue(args.columnIndex, "$$(AvailableQuantity)");
92-
}
96+
exportStarting: function (e, args) {
97+
showOverlay(args.grid, exportingOverlay);
9398
},
94-
cellExporting: function (e, args) {
95-
if (args.columnKey == "Quantity" && args.cellValue > 15) {
96-
args.xlRow.getCellFormat(args.columnIndex).font().bold(1);
97-
}
99+
success: function () {
100+
hideOverlay(exportingOverlay);
98101
},
99102
cellExported: function (e, args) {
100103
if (args.xlRow.index() == 0) {
101104
return;
102105
}
106+
if (args.columnKey == "Quantity" && args.cellValue > 15) {
107+
args.xlRow.getCellFormat(args.columnIndex).font().bold(1);
108+
args.xlRow.getCellFormat(args.columnIndex).fill($.ig.excel.CellFill.createLinearGradientFill(45, '#FF0000', '#00FFFF'));
109+
}
103110
if (args.columnKey == 'VendorWebsite') {
104111
var xlRow = args.xlRow;
105112
xlRow.cells(args.columnIndex).applyFormula('=HYPERLINK("' + args.cellValue + '")');
106113
}
107114
},
108-
rowExported: function (e, args) {
109-
if (args.xlRow.index() == args.grid.igGrid("allRows").length - 1) {
110-
$('<div style="font-size:20px;">$$(LastRowExported)</div>').insertBefore('#exportButton').delay(1000).fadeOut();
111-
}
112-
}
115+
exportEnding: function (e, args) {
116+
args.worksheet.columns().item(5).cellFormat().formatString("dd/MMM/YYYY");
117+
},
113118
});
114119
});
115120
});
121+
122+
function showOverlay(grid, exportingOverlay) {
123+
var $gridContainer = $('#' + grid.attr('id') + '_container');
124+
125+
exportingOverlay.css({
126+
"width": $gridContainer.outerWidth(),
127+
"height": $gridContainer.outerHeight()
128+
}).html('<span class="exporting-text">Exporting...</span>');
129+
exportingOverlay.addClass("exporting-overlay");
130+
131+
$gridContainer.append(exportingOverlay);
132+
}
133+
134+
function hideOverlay(exportingOverlay) {
135+
exportingOverlay.remove();
136+
}
116137
</script>
117138
</head>
118139
<body>

‎HTMLSamples/grid/strings-en.json‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -35,6 +35,7 @@
3535
"cran_juice": "Cranberry Juice",
3636
"date_format": "ddd, MMM-d-yy HH:mm",
3737
"default_row_selectors": "Default Row Selectors",
38+
"DeliveryDate": "Delivery Date",
3839
"Description": "Description",
3940
"dvd_player": "DVD Player",
4041
"EditingAPIEvents_editMode": "Edit mode",

‎HTMLSamples/grid/strings-ja.json‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -35,6 +35,7 @@
3535
"cran_juice": "クランベリー ジュース",
3636
"date_format": "yyyy年MM月dd日(ddd) HH時mm分",
3737
"default_row_selectors": "デフォルトの行セレクター",
38+
"DeliveryDate": "出荷日付",
3839
"Description": "説明",
3940
"dvd_player": "DVD プレーヤー",
4041
"EditingAPIEvents_editMode": "編集モード",

0 commit comments

Comments
 (0)