ig.GridExcelExporter
コード サンプル
<!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>
関連サンプル
- 基本グリッドを Excel にエクスポート
- 機能とグリッドを Excel へエクスポート
- グリッド Excel エクスポートのカスタマイズ
- 進行状況インジケーターとグリッドを Excel へエクスポート
関連トピック
依存関係
-
callbacks
- タイプ:
- object
- デフォルト:
- {}
エクスポーター イベントのコールバック。
-
cellExported
- タイプ:
- function
- デフォルト:
- null
セルをエクスポートした後に呼び出す関数。
関数は引数 sender および args 取得します。
args.columnKey を使用してセルの igGrid 列キーを取得します。
args.columnIndex を使用してセルの igGrid 列インデックスを取得します。
args.cellValue を使用して igGrid セル値を取得します。
args.rowId を使用して、行のキーまたはインデックスを取得します。
args.xlRow を使用して、セルの Excel 表現への参照を取得します。
args.grid を使用して、igGrid ウィジェットへの参照を取得します。コード サンプル
$.ig.GridExcelExporter.exportGrid($(".selector"), {}, { cellExported: function(sender, args) {...} }); -
cellExporting
- タイプ:
- function
- デフォルト:
- null
Cancel="true" セルをエクスポートする前に呼び出す関数。
関数は引数 sender および args を取得します。
args.columnKey を使用してセルの igGrid 列キーを取得します。
args.columnIndex を使用してセルの igGrid 列インデックスを取得します。
args.cellValue を使用して igGrid セル値を取得します。
args.rowId を使用して、行のキーまたはインデックスを取得します。
args.xlRow を使用して、セルの Excel 表現への参照を取得します。
args.grid を使用して、igGrid ウィジェットへの参照を取得します。
セルのエクスポートをキャンセルするには、false を返します。コード サンプル
$.ig.GridExcelExporter.exportGrid($(".selector"), {}, { cellExporting: function(sender, args) {...} }); -
error
- タイプ:
- function
- デフォルト:
- null
エクスポートが失敗されたときに呼び出される関数。
error を使用して、エラー オブジェクトへの参照を取得します。コード サンプル
$.ig.GridExcelExporter.exportGrid($(".selector"), {}, { error: function(error) {...} }); -
exportEnding
- タイプ:
- function
- デフォルト:
- null
Excel ファイルをダウンロードする前に呼び出す関数。
関数は引数 sender および args を取得します。
args.grid を使用して、igGrid ウィジェットへの参照を取得します。
args.workbook を使用して、Excel ワークブックへの参照を取得します。
args.worksheet を使用して、Excel ワークシートへの参照を取得します。
ファイルのダウンロードをキャンセルするには、false を返します。コード サンプル
$.ig.GridExcelExporter.exportGrid($(".selector"), {}, { exportEnding: function(sender, args) {...} }); -
exportStarting
- タイプ:
- function
- デフォルト:
- null
Cancel="true" エクスポートを開始する前に呼び出される関数。
関数は引数 sender および args を取得します。
args.grid を使用して、igGrid ウィジェットへの参照を取得します。
エクスポートをキャンセルするには、false を返します。コード サンプル
$.ig.GridExcelExporter.exportGrid($(".selector"), {}, { exportStarting: function(sender, args) {...} }); -
headerCellExported
- タイプ:
- function
- デフォルト:
- null
ヘッダー セルをエクスポートした後に呼び出す関数。
関数は引数 sender および args を取得します。
args.headerText を使用して igGrid の列ヘッダーのテキストを取得します。
args.columnKey を使用して igGrid の列キーを取得します。
args.columnIndex を使用して igGrid 列インデックスを取得します。コード サンプル
$.ig.GridExcelExporter.exportGrid($(".selector"), {}, { headerCellExported: function(sender, args) {...} }); -
headerCellExporting
- タイプ:
- function
- デフォルト:
- null
ヘッダー セルをエクスポートする前に呼び出す関数。
関数は引数 sender および args を取得します。
args.headerText を使用して igGrid の列ヘッダーのテキストを取得または設定します。
args.columnKey を使用して igGrid の列キーを取得します。
args.columnIndex を使用して igGrid 列インデックスを取得します。
セルのエクスポートをキャンセルするには、false を返します。コード サンプル
$.ig.GridExcelExporter.exportGrid($(".selector"), {}, { headerCellExporting: function(sender, args) {...} }); -
rowExported
- タイプ:
- function
- デフォルト:
- null
Cancel="true" 行をエクスポートした後に呼び出す関数。
関数は引数 sender および args を取得します。
args.rowId を使用して、行のキーまたはインデックスを取得します。
args.element を使用して、行の TR 要素を取得します。
args.xlRow を使用して、Excel 行への参照を取得します。
args.grid を使用して、igGrid ウィジェットへの参照を取得します。
注: igHierarchicalGrid をエクスポートする場合、このコールバックはルート グリッドの行でのみで利用可能です。コード サンプル
$.ig.GridExcelExporter.exportGrid($(".selector"), {}, { rowExported: function(sender, args) {...} }); -
rowExporting
- タイプ:
- function
- デフォルト:
- null
行をエクスポートする前に呼び出す関数。
関数は引数 sender および args を取得します。
args.rowId を使用して、行のキーまたはインデックスを取得します。
args.element を使用して、行の TR 要素を取得します。
args.xlRow を使用して、Excel 行への参照を取得します。
args.grid を使用して、igGrid ウィジェットへの参照を取得します。
行のエクスポートをキャンセルするには、false を返します。
注: igHierarchicalGrid をエクスポートする場合、このコールバックはルート グリッドの行でのみで利用可能です。コード サンプル
$.ig.GridExcelExporter.exportGrid($(".selector"), {}, { rowExporting: function(sender, args) {...} }); -
success
- タイプ:
- function
- デフォルト:
- null
ファイルの保存に成功したときに呼び出す関数。
data を使用して、保存されたオブジェクトへの参照を取得します。コード サンプル
$.ig.GridExcelExporter.exportGrid($(".selector"), {}, { success: function(sender, data) {...} }); -
summaryExported
- タイプ:
- function
- デフォルト:
- null
集計をエクスポートした後に呼び出す関数。
関数は引数 sender および args を取得します。
args.headerText を使用して igGrid の列ヘッダーのテキストを取得します。
args.columnKey を使用して igGrid の列キーを取得します。
args.columnIndex を使用して igGrid 列インデックスを取得します。
args.summary を使用して、集計オブジェクトへの参照を取得します。
args.xlRowIndex を使用して、ワークシート行インデックスを取得します。コード サンプル
$.ig.GridExcelExporter.exportGrid($(".selector"), {}, { summaryExported: function(sender, args) {...} }); -
summaryExporting
- タイプ:
- function
- デフォルト:
- null
集計をエクスポートする前に呼び出す関数。
関数は引数 sender および args を取得します。
args.headerText を使用して igGrid の列ヘッダーのテキストを取得します。
args.columnKey を使用して igGrid の列キーを取得します。
args.columnIndex を使用して igGrid 列インデックスを取得します。
args.summary を使用して、集計オブジェクトへの参照を取得します。
args.xlRowIndex を使用して、ワークシート行インデックスへの参照を取得します。
集計のエクスポートをキャンセルするには、false を返します。コード サンプル
$.ig.GridExcelExporter.exportGrid($(".selector"), {}, { summaryExporting: function(sender, args) {...} });
-
settings
- タイプ:
- object
- デフォルト:
- {}
Infragistics グリッド Excel エクスポーター クライアント側コンポーネントはクラスとして実装されます。列固定、フィルター、非表示、ページング、並べ替え、および集計の機能と igGrid コントロールをエクスポートします。
-
columnsToSkip
- タイプ:
- array
- デフォルト:
- []
- 要素タイプ:
- object
エクスポートされない列のキーを含む文字列の配列。
コード サンプル
var exp = new $.ig.GridExcelExporter(); exp.exportGrid($(".selector"), { // The keys of the columns that will not be exported columnsToSkip: ["column1", "column2", "column3"] }); -
dataExportMode
- タイプ:
- enumeration
- デフォルト:
- allRows
すべてのサブレベル データがエクスポートされるか、あるいは展開行の下のデータのみをエクスポートするかどうかを示します。
メンバー
- allRows
- タイプ:string
- すべてのサブレベル データがエクスポートされます。
- expandedRows
- タイプ:string
- 展開行の下のデータのみがエクスポートされます。
コード サンプル
var exp = new $.ig.GridExcelExporter(); exp.exportGrid($(".selector"), { //Setting the dataExportMode option dataExportMode: "expandedRows", }); -
fileName
- タイプ:
- string
- デフォルト:
- "document"
生成される Excel ファイルの名前を指定します。
コード サンプル
var exp = new $.ig.GridExcelExporter(); exp.exportGrid($(".selector"), { //Setting the file name fileName: "Document", }); -
gridFeatureOptions
- タイプ:
- object
- デフォルト:
- {}
グリッドの Excel エクスポーターと使用可能なエクスポート設定のリスト。
-
columnfixing
- タイプ:
- enumeration
- デフォルト:
- none
エクスポートされた表で固定列が適用されるかどうかを示します。これはデフォルトで none に設定されますが、列固定機能が igGrid で定義される場合、applied に設定されます。
メンバー
- none
- タイプ:string
- 列固定は Excel 文書に適用されません。
- applied
- タイプ:string
- 列固定は Excel 文書に適用されます。
コード サンプル
var exp = new $.ig.GridExcelExporter(); exp.exportGrid($(".selector"), { gridFeatureOptions: { // Exports without columnFixing enabled in the excel document columnFixing: "none" } }); -
filtering
- タイプ:
- enumeration
- デフォルト:
- none
エクスポートされた表でフィルターが適用されるかどうかを示します。これはデフォルトで none に設定されますが、フィルター機能が igGrid で定義される場合、applied に設定されます。
メンバー
- none
- タイプ:string
- フィルターは Excel 文書に適用されません。
- applied
- タイプ:string
- フィルターは Excel 文書に適用されます。
- filteredRowsOnly
- タイプ:string
- フィルターは Excel 文書にエクスポートされます。
コード サンプル
var exp = new $.ig.GridExcelExporter(); exp.exportGrid($(".selector"), { gridFeatureOptions: { // Exports without filtering enabled in the excel document filtering: "none" } }); -
hiding
- タイプ:
- enumeration
- デフォルト:
- none
エクスポートされた表で非表示列が削除されるかどうかを示します。これはデフォルトで none に設定されますが、非表示機能が igGrid で定義される場合、applied に設定されます。
メンバー
- none
- タイプ:string
- すべての非表示列は Excel 文書にエクスポートされます。
- applied
- タイプ:string
- 非表示列は Excel 文書に非表示としてエクスポートされます。
- visibleColumnsOnly
- タイプ:string
- 表示列のみエクスポートされます。
コード サンプル
var exp = new $.ig.GridExcelExporter(); exp.exportGrid($(".selector"), { gridFeatureOptions: { // No columns will be hidden in the excel document hiding: "none" } }); -
paging
- タイプ:
- enumeration
- デフォルト:
- allRows
現在のページの行またはすべてのデータがエクスポートされるかどうかを示します。
メンバー
- currentPage
- タイプ:string
- 現在のページのみは Excel 文書にエクスポートされます。
- allRows
- タイプ:string
- すべてのページは Excel 文書にエクスポートされます。
コード サンプル
var exp = new $.ig.GridExcelExporter(); exp.exportGrid($(".selector"), { gridFeatureOptions: { // Exports the currentPage in the excel document paging: "currentPage" } }); -
sorting
- タイプ:
- enumeration
- デフォルト:
- none
エクスポートされた表で並べ替えが適用されるかどうかを示します。これはデフォルトで none に設定されますが、並べ替え機能が igGrid で定義される場合、applied に設定されます。
メンバー
- none
- タイプ:string
- 並べ替えは Excel 文書に適用されません。
- applied
- タイプ:string
- 並べ替えは Excel 文書に適用されます。
コード サンプル
var exp = new $.ig.GridExcelExporter(); exp.exportGrid($(".selector"), { gridFeatureOptions: { // No sorting will be applied to the excel document sorting: "none" } }); -
summaries
- タイプ:
- enumeration
- デフォルト:
- none
エクスポートされた表に集計が追加されるかどうかを示します。これはデフォルトで none に設定されますが、集計機能が igGrid で定義される場合、applied に設定されます。
メンバー
- none
- タイプ:string
- 集計は Excel 文書にエクスポートされません。
- applied
- タイプ:string
- 集計は Excel 文書にエクスポートされます。
コード サンプル
var exp = new $.ig.GridExcelExporter(); exp.exportGrid($(".selector"), { gridFeatureOptions: { // No summaries will be applied to the excel document summaries: "none" } });
-
gridStyling
- タイプ:
- enumeration
- デフォルト:
- applied
Excel 表スタイル設定はグリッドのスタイル設定と同じに設定されるかどうかを示します。これはデフォルトで applied に設定されています。カスタム グリッド テーマはサポートされません。
メンバー
- none
- タイプ:string
- グリッドのスタイル設定は表領域に適用されません。
- applied
- タイプ:string
- グリッドのスタイル設定は表領域に適用されます。
コード サンプル
var exp = new $.ig.GridExcelExporter(); exp.exportGrid($(".selector"), { // Grid style will be exported to the excel table gridStyling: "applied" }); -
skipFilteringOn
- タイプ:
- array
- デフォルト:
- []
- 要素タイプ:
- object
フィルターが適用されないワークシート列のキーを含む文字列のリスト。
コード サンプル
var exp = new $.ig.GridExcelExporter(); exp.exportGrid($(".selector"), { // The keys of columns that filtering will skip skipFilteringOn: ["column1", "column2", "column3"], }); -
tableStyle
- タイプ:
- string
- デフォルト:
- "TableStyleMedium1"
Excel 表のスタイル領域を指定します。以下の表スタイルが可能です。
TableStyleMedium[1-28]
TableStyleLight[1-21]
TableStyleDark[1-11].コード サンプル
var exp = new $.ig.GridExcelExporter(); exp.exportGrid($(".selector"), { gridStyling: "none", //Setting the table style to TableStyleDark tableStyle: "TableStyleDark2" }); -
worksheetName
- タイプ:
- string
- デフォルト:
- "Sheet1"
igGrid がエクスポートされるワークシート名を指定します。
コード サンプル
var exp = new $.ig.GridExcelExporter(); exp.exportGrid($(".selector"), { //Setting the name of the worksheet worksheetName: "Worksheet1", });
-
ig.GridExcelExporter
コンストラクター- new $.ig.GridExcelExporter( );
-
exportGrid
- .exportGrid( grid:object, userSettings:object, userCallbacks:object );
提供された igGrid を Excel 文書にエクスポートします。
- grid
- タイプ:object
- igGrid の jQuery 要素。
- userSettings
- タイプ:object
- グリッドのエクスポートの設定。
- userCallbacks
- タイプ:object
- イベントのコールバック。
コード サンプル
var exp = new $.ig.GridExcelExporter(); exp.exportGrid($(".selector"), { fileName: "igGrid", gridFeatureOptions: {"sorting": "applied", "filtering": "applied", "paging": "currentPage"} });