Ignite UI™ API ヘルプ

ui.igSpreadsheet

igSpreadsheet コントロールでは、Infragistics JavaScript Excel Library でサポートされるデータモデルによって表されるスプレッドシートデータの表示ができます。データモデルには、ワークブック、ワークシート、セル、数式などが含まれます。

コードサンプル

<!DOCTYPE html>
<html>
<head>
    <title>igSpreadsheet Overview</title>
    <script src="http://ajax.aspnetcdn.com/ajax/modernizr/modernizr-2.8.3.js"></script>
    <script src="http://code.jquery.com/jquery-1.11.3.min.js"></script>
    <script src="http://code.jquery.com/ui/1.11.1/jquery-ui.min.js"></script>
 
    <!-- Ignite UI Required Combined JavaScript Files -->
    <script src="js/infragistics.loader.js" type="text/javascript"></script>
 
    </head>
    <body>
        <div id="spreadsheet"></div>
        <script type="text/javascript">
            $.ig.loader({
                scriptPath: "js/",
                cssPath: "css/",
                resources: "igSpreadsheet",
                ready: function () {
                    $("#spreadsheet").igSpreadsheet({
                        height: "600",
                        width: "100%",
                        activeCell: "D4"
                    });
                }
            });
        </script>
    </body>
    </html>

activeCell

タイプ:: string
デフォルト:: "A1"

選択されたワークシート内の現在アクティブセルの A1 書式アドレスを返すか、設定します。

コードサンプル

//Initialize
$(".selector").igSpreadsheet({
    activeCell : "B4"
});
 
// Get
var activeCell = $(".selector").igSpreadsheet("option", "activeCell");
 
// Set
$(".selector").igSpreadsheet("option", "activeCell", "B4");

activeWorksheet

タイプ:: object
デフォルト:: null

コンテンツがコントロール内に表示されるワークブックからワークシートを返すか、設定します。

コードサンプル

//Initialize
var wb = new $.ig.excel.Workbook($.ig.excel.WorkbookFormat.excel2007);
var sheet1 = wb.worksheets().add("sheet1");
var sheet2 = wb.worksheets().add("sheet2");
var sheet3 = wb.worksheets().add("sheet3");
$(".selector").igSpreadsheet({
    workbook: wb,
    activeWorksheet: sheet2
});
 
//Get
var activeWorksheet = $(".selector").igSpreadsheet("option", "activeWorksheet");
 
//Set
$(".selector").igSpreadsheet("option", "activeWorksheet", sheet2);

allowAddWorksheet

タイプ:: bool
デフォルト:: true

スプレッドシートでワークシートの追加を許可するかどうかを示すブール値を返すか、設定します。

コードサンプル

//Initialize
$(".selector").igSpreadsheet({
    allowAddWorksheet: false
});
 
//Get
var allowAddWorksheet = $(".selector").igSpreadsheet("option", "allowAddWorksheet");
 
//Set
$(".selector").igSpreadsheet("option", "allowAddWorksheet", false);

allowDeleteWorksheet

タイプ:: bool
デフォルト:: true

スプレッドシートでワークシートの削除を許可するかどうかを示すブール値を返すか、設定します。

コードサンプル

//Initialize
$(".selector").igSpreadsheet({
    allowDeleteWorksheet: false
});
 
//Get
var allowDeleteWorksheet = $(".selector").igSpreadsheet("option", "allowDeleteWorksheet");
 
//Set
$(".selector").igSpreadsheet("option", "allowDeleteWorksheet", false);

areGridlinesVisible

タイプ:: bool
デフォルト:: true

グリッド線が選択のワークシートに表示されるかどうかを示すブール値を返すか、設定します。

コードサンプル

//Initialize
$(".selector").igSpreadsheet({
    areGridlinesVisible: false
});
 
//Get
var areGridlinesVisible = $(".selector").igSpreadsheet("option", "areGridlinesVisible");
 
//Set
$(".selector").igSpreadsheet("option", "areGridlinesVisible", false);

areHeadersVisible

タイプ:: bool
デフォルト:: true

行と列のヘッダーが選択のワークシートに表示されるかどうかを示すブール値を返すか、設定します。

コードサンプル

//Initialize
$(".selector").igSpreadsheet({
    areHeadersVisible: false
});
 
//Get
var areHeadersVisible = $(".selector").igSpreadsheet("option", "areHeadersVisible");
 
//Set
$(".selector").igSpreadsheet("option", "areHeadersVisible", false);

brushes

タイプ:: object
デフォルト:: {}

スプレッドシートの領域のためのブラシを持つオブジェクトを返すか、設定します。プロパティ名は SpreadsheetResourceId 列挙体の項目で、プロパティ値はブラシを表す文字列です。このブラシは関連するオブジェクトの CSS スタイル設定をオーバーライドします。

コードサンプル

//Initialize
$(".selector").igSpreadsheet({
    brushes : {
        cellSelectionFill: "rgba(0,0,0,0.1)",
    }
});
 
// Get
var brushes = $(".selector").igSpreadsheet("option", "brushes");
 
// Set
$(".selector").igSpreadsheet("option", "brushes", { cellSelectionFill: "rgba(0,0,0,0.1)" });

enterKeyNavigationDirection

タイプ:: string
デフォルト:: "down"

Enter キーを押すときにアクティブ化される activeCell に隣接するセルの方向示す列挙体を返すか、設定します。このプロパティは、isEnterKeyNavigationEnabled が True に設定されている場合にのみ使用できます。また、Shift + Enter を押すと反対の方向へ移動します。

コードサンプル

//Initialize
$(".selector").igSpreadsheet({
    enterKeyNavigationDirection: "right"
});
 
//Get
var enterKeyNavigationDirection = $(".selector").igSpreadsheet("option", "enterKeyNavigationDirection");
 
//Set
$(".selector").igSpreadsheet("option", "enterKeyNavigationDirection", "right");

fixedDecimalPlaceCount

タイプ:: number
デフォルト:: 2

isFixedDecimalEnabled が true のときに編集モードでタイプされる整数によって小数点以下の桁数のを返すか、設定します。

コードサンプル

//Initialize
$(".selector").igSpreadsheet({
    isFixedDecimalEnabled : true,
    fixedDecimalPlaceCount: 3
});
 
//Get
var fixedDecimalPlaceCount = $(".selector").igSpreadsheet("option", "fixedDecimalPlaceCount");
 
//Set
$(".selector").igSpreadsheet("option", "fixedDecimalPlaceCount", 3);

height

タイプ:: enumeration
デフォルト:: null

スプレッドシートの高さ。ピクセル、文字列 (px)、またはパーセンテージ (%) を数字で設定できます。

メンバー

string
タイプ:string
ウィジェットの高さはピクセル (px) およびパーセント (%) で設定できます。
number
タイプ:number
ウィジェットの高さは数値として設定できます。

コードサンプル

//Initialize
$(".selector").igSpreadsheet({
    height : "800px"
});
// Get
var height = $(".selector").igSpreadsheet("option", "height");
// Set
$(".selector").igSpreadsheet("option", "height", "800px");

isEnterKeyNavigationEnabled

タイプ:: bool
デフォルト:: true

Enter キーを押したときに enterKeyNavigationDirection で示されている隣接するセルが移動するかどうかを示すブール値を返す、または設定します。

コードサンプル

//Initialize
$(".selector").igSpreadsheet({
    isEnterKeyNavigationEnabled: false
});
 
//Get
var isEnterKeyNavigationEnabled = $(".selector").igSpreadsheet("option", "isEnterKeyNavigationEnabled");
 
//Set
$(".selector").igSpreadsheet("option", "isEnterKeyNavigationEnabled", false);

isFixedDecimalEnabled

タイプ:: bool
デフォルト:: false

編集モードで整数が入力されるときに固定小数位が自動的に追加されるかどうかを示すブール値を返すか、設定します。

コードサンプル

//Initialize
$(".selector").igSpreadsheet({
    isFixedDecimalEnabled: true
});
 
//Get
var isFixedDecimalEnabled = $(".selector").igSpreadsheet("option", "isFixedDecimalEnabled");
 
//Set
$(".selector").igSpreadsheet("option", "isFixedDecimalEnabled", true);

isFormulaBarVisible

タイプ:: bool
デフォルト:: true

数式バーが Spreadsheet で表示されるかどうかを示すブール値を返すか、設定します。

コードサンプル

//Initialize
$(".selector").igSpreadsheet({
    isFormulaBarVisible: false
});
 
//Get
var isFormulaBarVisible = $(".selector").igSpreadsheet("option", "isFormulaBarVisible");
 
//Set
$(".selector").igSpreadsheet("option", "isFormulaBarVisible", false);

isInEndMode

タイプ:: bool
デフォルト:: false

コントロールが "End mode" かどうかを示すブール値を返すか、設定します。
終了モードとは、方向キーを使用し移動をするようなキーボードナビゲーションに影響を及ぼすモードです。たとえば、終了モード中に右矢印キーを押すと現在の activeCell の右の値を持つ最初のセルに変更されます (たとえ値が "" の場合も含め)。右に値を持つセルがない場合、この行で一番右にあるセルをアクティブ化します。終了モードは、方向キーを押すときのように自動的に終了します。

コードサンプル

//Initialize
$(".selector").igSpreadsheet({
    isInEndMode: true
});
 
//Get
var isInEndMode = $(".selector").igSpreadsheet("option", "isInEndMode");
 
//Set
$(".selector").igSpreadsheet("option", "isInEndMode", true);

isScrollLocked

タイプ:: bool
デフォルト:: false

Scroll Lock キーが切り替わったかどうかを示すブール値を取得または設定します。
このプロパティは、コントロールにフォーカスがある場合に特定のキーが押されたときに使用されます。
たとえば、スクロールロックが有効な場合に矢印キーが押されたら、アクティブセルを変更せずにセル領域がスクロールされます。
注: このプロパティはコントロールによって処理/変更されません。スクロールロックが有効かどうかに影響される操作の実行でクエリされます。

コードサンプル

//Initialize
$(".selector").igSpreadsheet({
    isScrollLocked: true
});
 
//Get
var isScrollLocked = $(".selector").igSpreadsheet("option", "isScrollLocked");
 
//Set
$(".selector").igSpreadsheet("option", "isScrollLocked", true);

isUndoEnabled

タイプ:: bool
デフォルト:: true

元に戻すがコントロールで有効かどうかを示すブール値を返すか、設定します。

コードサンプル

//Initialize
$(".selector").igSpreadsheet({
    isUndoEnabled: false
});
 
//Get
var isUndoEnabled = $(".selector").igSpreadsheet("option", "isUndoEnabled");
 
//Set
$(".selector").igSpreadsheet("option", "isUndoEnabled", false);

language
継承

タイプ:: string
デフォルト:: "en"

ウィジェットのロケール言語設定を取得または設定します。

コードサンプル

    //Initialize
$(".selector").igSpreadsheet({
    language: "ja"
});
 
// Get
var language = $(".selector").igSpreadsheet("option", "language");
 
// Set
$(".selector").igSpreadsheet("option", "language", "ja");

locale
継承

タイプ:: object
デフォルト:: null

ウィジェットのロケール設定を取得または設定します。

コードサンプル

    //Initialize
$(".selector").igSpreadsheet({
    locale: {}
});
 
// Get
var locale = $(".selector").igSpreadsheet("option", "locale");
 
// Set
$(".selector").igSpreadsheet("option", "locale", {});

nameBoxWidth

タイプ:: number
デフォルト:: 102

数式バー内の名前ボックスの幅を返すか、設定します。

コードサンプル

//Initialize
$(".selector").igSpreadsheet({
    nameBoxWidth: 150
});
 
//Get
var nameBoxWidth = $(".selector").igSpreadsheet("option", "nameBoxWidth");
 
//Set
$(".selector").igSpreadsheet("option", "nameBoxWidth", 150);

regional
継承

タイプ:: enumeration
デフォルト:: defaults

ウィジェットの領域設定を取得または設定します。

コードサンプル

//Initialize
$(".selector").igSpreadsheet({
    regional: "ja"
});
// Get
var regional = $(".selector").igSpreadsheet("option", "regional");
// Set
$(".selector").igSpreadsheet("option", "regional", "ja");

selectedWorksheets

タイプ:: object
デフォルト:: null

Type="ig.excel.Worksheet[]" タブが選択されるワークシートの配列を返すか、設定します。

コードサンプル

//Initialize
var wb = new $.ig.excel.Workbook($.ig.excel.WorkbookFormat.excel2007);
var sheet1 = wb.worksheets().add("sheet1");
var sheet2 = wb.worksheets().add("sheet2");
var sheet3 = wb.worksheets().add("sheet3");
$(".selector").igSpreadsheet({
    workbook: wb,
    activeWorksheet: sheet1,
    selectedWorksheets: [sheet1, sheet3]
});
 
//Get
var selectedWorksheets = $(".selector").igSpreadsheet("option", "selectedWorksheets");
 
//Set
$(".selector").igSpreadsheet("option", "selectedWorksheets", [sheet1, sheet3]);

selectionMode

タイプ:: string
デフォルト:: "normal"

マウスやキーボードでセルを操作しているときに選択が更新される方法を示す値を返すか、設定します。

コードサンプル

//Initialize
$(".selector").igSpreadsheet({
    selectionMode: "extendSelection"
});
 
//Get
var selectionMode = $(".selector").igSpreadsheet("option", "selectionMode");
 
//Set
$(".selector").igSpreadsheet("option", "selectionMode", "extendSelection");

validationInputMessagePosition

タイプ:: object
デフォルト:: null

アクティブセルと関連付けられたデータ検証条件の入力メッセージの表示に使用される画面ヒントの位置を返すか、設定します。

提供されたオブジェクトは、x および y と呼ばれる数値プロパティを持っている必要があります。

コードサンプル

//Initialize
$(".selector").igSpreadsheet({
    validationInputMessagePosition: { x: 50, y: 50 }
});
 
//Get
var validationInputMessagePosition = $(".selector").igSpreadsheet("option", "validationInputMessagePosition");
 
//Set
$(".selector").igSpreadsheet("option", "validationInputMessagePosition", { x: 50, y: 50 });

width

タイプ:

enumeration

デフォルト:

null
スプレッドシートの幅。ピクセル、文字列 (px)、またはパーセンテージ (%) を数字で設定できます。
メンバー
- string
- タイプ:string
- ウィジェットの幅をピクセル (px) またはパーセンテージ (%) に設定できます。
- number
- タイプ:number
- ウィジェット幅は数値として設定できます。
コードサンプル

// Initialize
$(".selector").igSpreadsheet({
width : "800px"
});
// Get
var width = $(".selector").igSpreadsheet("option", "width");
// Set
$(".selector").igSpreadsheet("option", "width", "800px");

workbook

タイプ:: object
デフォルト:: null

情報がコントロールで表示されるワークブックを返すか、設定します。

コードサンプル

//Initialize
var wb = new $.ig.excel.Workbook($.ig.excel.WorkbookFormat.excel2007);
wb.worksheets().add("sheet1");
$(".selector").igSpreadsheet({
    workbook: wb
});
 
//Get
var workbook = $(".selector").igSpreadsheet("option", "workbook");
 
//Set
$(".selector").igSpreadsheet("option", "workbook", wb);

zoomLevel

タイプ:: number
デフォルト:: 100

選択済みのワークシートの倍率を返すか、設定します。

コードサンプル

//Initialize
$(".selector").igSpreadsheet({
    zoomLevel: 150
});
 
//Get
var zoomLevel = $(".selector").igSpreadsheet("option", "zoomLevel");
 
//Set
$(".selector").igSpreadsheet("option", "zoomLevel", 150);

Ignite UI コントロールイベントの詳細については、
Ignite UI でイベントを使用するを参照してください。

注: API メソッドの呼び出しは、API ヘルプに特に記述がない限り、操作に関連するイベントはプログラムによって発生されません。これらのイベントは各ユーザー操作によってのみ呼び出されます。

詳細の表示

actionExecuted

キャンセル可能:: false

アクションが Spreadsheet で実行されるときに呼び出されます。

evt
タイプ: Event

jQuery イベントオブジェクト。
ui
タイプ: Object

コードサンプル

//Delegate
$(document).delegate(".selector", "igspreadsheetactionexecuted", function (evt, ui) {
    ...
});
 
//Initialize
$(".selector").igSpreadsheet({
    actionExecuted: function(evt, ui) {...}
});

actionExecuting

キャンセル可能:: true

アクションが Spreadsheet で実行されようとするときに呼び出されます。

evt
タイプ: Event

jQuery イベントオブジェクト。
ui
タイプ: Object

コードサンプル

//Delegate
$(document).delegate(".selector", "igspreadsheetactionexecuting", function (evt, ui) {
    ...
});
 
//Initialize
$(".selector").igSpreadsheet({
    actionExecuting: function(evt, ui) {...}
});

activeCellChanged

キャンセル可能:: false

Spreadsheet の activeCell が変更されたときに呼び出されます。

evt
タイプ: Event

jQuery イベントオブジェクト。
ui
タイプ: Object

コードサンプル

//Delegate
$(document).delegate(".selector", "igspreadsheetactivecellchanged", function (evt, ui) {
    ...
});
 
//Initialize
$(".selector").igSpreadsheet({
    activeCellChanged: function(evt, ui) {...}
});

activePaneChanged

キャンセル可能:: false

Spreadsheet の activePane が変更されたときに呼び出されます。

evt
タイプ: Event

jQuery イベントオブジェクト。
ui
タイプ: Object

コードサンプル

//Delegate
$(document).delegate(".selector", "igspreadsheetactivepanechanged", function (evt, ui) {
    ...
});
 
//Initialize
$(".selector").igSpreadsheet({
    activePaneChanged: function(evt, ui) {...}
});

activeTableChanged

キャンセル可能:: false

Spreadsheet の activeTable が変更されたときに呼び出されます。

evt
タイプ: Event

jQuery イベントオブジェクト。
ui
タイプ: Object

コードサンプル

//Delegate
$(document).delegate(".selector", "igspreadsheetactivetablechanged", function (evt, ui) {
    ...
});
 
//Initialize
$(".selector").igSpreadsheet({
    activeTableChanged: function(evt, ui) {...}
});

activeWorksheetChanged

キャンセル可能:: false

Spreadsheet の activeWorksheet が変更されたときに呼び出されます。

evt
タイプ: Event

jQuery イベントオブジェクト。
ui
タイプ: Object

コードサンプル

//Delegate
$(document).delegate(".selector", "igspreadsheetactiveworksheetchanged", function (evt, ui) {
    ...
});
 
//Initialize
$(".selector").igSpreadsheet({
    activeWorksheetChanged: function(evt, ui) {...}
});

contextMenuOpening

キャンセル可能:: true

evt
タイプ: Event
ui
タイプ: Object

コードサンプル

//Delegate
$(document).delegate(".selector", "igspreadsheetcontextmenuopening", function (evt, ui) {
    ...
});
 
//Initialize
$(".selector").igSpreadsheet({
    contextMenuOpening: function(evt, ui) {...}
});

editModeEntered

キャンセル可能:: false

Spreadsheet が activeCell のインプレース編集を開始したときに呼び出されます。

evt
タイプ: Event

jQuery イベントオブジェクト。
ui
タイプ: Object

コードサンプル

//Delegate
$(document).delegate(".selector", "igspreadsheeteditmodeentered", function (evt, ui) {
    ...
});
 
//Initialize
$(".selector").igSpreadsheet({
    editModeEntered: function(evt, ui) {...}
});

editModeEntering

キャンセル可能:: true

Spreadsheet が activeCell のインプレース編集を開始しようとするときに呼び出されます。

evt
タイプ: Event

jQuery イベントオブジェクト。
ui
タイプ: Object

コードサンプル

//Delegate
$(document).delegate(".selector", "igspreadsheeteditmodeentering", function (evt, ui) {
    ...
});
 
//Initialize
$(".selector").igSpreadsheet({
    editModeEntering: function(evt, ui) {...}
});

editModeExited

キャンセル可能:: false

Spreadsheet が activeCell のインプレース編集を終了したときに呼び出されます。

evt
タイプ: Event

jQuery イベントオブジェクト。
ui
タイプ: Object

コードサンプル

//Delegate
$(document).delegate(".selector", "igspreadsheeteditmodeexited", function (evt, ui) {
    ...
});
 
//Initialize
$(".selector").igSpreadsheet({
    editModeExited: function(evt, ui) {...}
});

editModeExiting

キャンセル可能:: true

Spreadsheet が activeCell のインプレース編集を終了しようとするときに呼び出されます。

evt
タイプ: Event

jQuery イベントオブジェクト。
ui
タイプ: Object

コードサンプル

//Delegate
$(document).delegate(".selector", "igspreadsheeteditmodeexiting", function (evt, ui) {
    ...
});
 
//Initialize
$(".selector").igSpreadsheet({
    editModeExiting: function(evt, ui) {...}
});

editModeValidationError

キャンセル可能:: false

Spreadsheet が編集モードを終了し、activeCell の新しい値がセルの ig.excel.DataValidationRule の条件に基づいて有効ではない場合に発生されます。
編集モードを終了する際に activeCell の新しい値がセルの ig.excel.DataValidationRule の条件に基づいて有効ではない場合に EditModeValidationError が発生されます。
ルールがセルの値およびワークシートのその他のセルの値を評価する必要があるため、値は最初にセルに適用され、その後に検証されます。デフォルトで、イベントが処理されずに showErrorMessageForInvalidValue が true の場合、実行するアクションを決定するためにメッセージボックスがエンドユーザーに表示されます。このイベントを処理し、アクションを使用して実行するアクションを指定できます。注: Escape または「編集のキャンセル」を押して編集モードをキャンセルすると検証ルールは評価されません。注: validationRule の ShowErrorMessageForInvalidValue が false の場合、アクションのデフォルト値は AcceptChange になります。それ以外の場合、デフォルト値は ShowPrompt になります。注: Microsoft Excel のように、更新が選択のその他のセルに影響する場合もアクティブなセルの検証ルールが評価されます。

evt
タイプ: Event

jQuery イベントオブジェクト。
ui
タイプ: Object

コードサンプル

//Delegate
$(document).delegate(".selector", "igspreadsheeteditmodevalidationerror", function (evt, ui) {
    ...
});
 
//Initialize
$(".selector").igSpreadsheet({
    editModeValidationError: function(evt, ui) {...}
});

editRangePasswordNeeded

キャンセル可能:: true

保護された Worksheet で Spreadsheet が操作を実行し、操作の実行を許可するためにロック解除する単一の範囲がある場合に呼び出されます。
関数の最初の引数は ui です。

evt
タイプ: Event

jQuery イベントオブジェクト。
ui
タイプ: Object

コードサンプル

//Delegate
$(document).delegate(".selector", "igspreadsheeteditrangepasswordneeded", function (evt, ui) {
    ...
});
 
//Initialize
$(".selector").igSpreadsheet({
    editRangePasswordNeeded: function(evt, ui) {...}
});

hyperlinkExecuting

キャンセル可能:: true

ハイパーリンクが Spreadsheet で開かれる時に発生します。

evt
タイプ: Event

jQuery イベントオブジェクト。
ui
タイプ: Object

コードサンプル

//Delegate
$(document).delegate(".selector", "igspreadsheethyperlinkexecuting", function (evt, ui) {
    ...
});
 
//Initialize
$(".selector").igSpreadsheet({
    hyperlinkExecuting: function(evt, ui) {...}
});

selectionChanged

キャンセル可能:: false

Spreadsheet の ig.spreadsheet.SpreadsheetPane の選択が変更されたときに呼び出されます。

evt
タイプ: Event

jQuery イベントオブジェクト。
ui
タイプ: Object

コードサンプル

//Delegate
$(document).delegate(".selector", "igspreadsheetselectionchanged", function (evt, ui) {
    ...
});
 
//Initialize
$(".selector").igSpreadsheet({
    selectionChanged: function(evt, ui) {...}
});

userPromptDisplaying

キャンセル可能:: true

ユーザーが操作に関するメッセージを表示されるときに呼び出されます。

evt
タイプ: Event

jQuery イベントオブジェクト。
ui
タイプ: Object

コードサンプル

//Delegate
$(document).delegate(".selector", "igspreadsheetuserpromptdisplaying", function (evt, ui) {
    ...
});
 
//Initialize
$(".selector").igSpreadsheet({
    userPromptDisplaying: function(evt, ui) {...}
});

workbookDirtied

キャンセル可能:: false

ワークブックに対して、保存が必要な可能性のある変更がされたときに呼び出されます。
注: このイベントは、発生した変更とは非同期的に呼び出されます。また一部の変更だけは、ワークブックまたはそのサブオブジェクトの 1 つの状態が変更されてもダーティと見なされません。その一例として、ズーム操作（magnificationInNormalView の変更など）があります。

evt
タイプ: Event

jQuery イベントオブジェクト。
ui
タイプ: Object

コードサンプル

//Delegate
$(document).delegate(".selector", "igspreadsheetworkbookdirtied", function (evt, ui) {
    ...
});
 
//Initialize
$(".selector").igSpreadsheet({
    workbookDirtied: function(evt, ui) {...}
});

詳細の表示

changeGlobalLanguage
継承

.igSpreadsheet( "changeGlobalLanguage" );
ウィジェットの言語をグローバルの言語に変更します。グローバルの言語は $.ig.util.language の値です。
コードサンプル

$(".selector").igSpreadsheet("changeGlobalLanguage");
changeGlobalRegional
継承

.igSpreadsheet( "changeGlobalRegional" );
ウィジェットの地域設定をグローバルの地域設定に変更します。グローバルの地域設定は $.ig.util.regional にあります。
コードサンプル

$(".selector").igSpreadsheet("changeGlobalRegional");
changeLocale

.igSpreadsheet( "changeLocale", $container:object );
- $container
- タイプ:object
destroy

.igSpreadsheet( "destroy" );
ウィジェットを破棄します。
コードサンプル

var executed = $(".selector").igSpreadsheet("destroy");
executeAction

.igSpreadsheet( "executeAction", action:object );

返却型:

bool

返却型の説明:

アクションが実行されたかどうかを示すブール値。
指定の ID に関連するアクションを実行します。
- action
- タイプ:object
- 実行するアクションを識別する列挙体または文字列。
コードサンプル

var executed = $(".selector").igSpreadsheet("executeAction", "clearContents");
exportVisualData

.igSpreadsheet( "exportVisualData" );
ユニットテスト用にスプレッドシートの視覚的なデータをエクスポートします。
flush

.igSpreadsheet( "flush" );
続行の前に保留中の作業をスプレッドシートで描画するように強制します。
コードサンプル

var executed = $(".selector").igSpreadsheet("flush");
getActivePane

.igSpreadsheet( "getActivePane" );
フォーカスを受けたペインを表すオブジェクトを返します。
コードサンプル

var activePane = $(".selector").igSpreadsheet("getActivePane");
getActiveSelection

.igSpreadsheet( "getActiveSelection" );
アクティブなペインの現在選択を表すオブジェクトを返します。
コードサンプル

var activeSelection = $(".selector").igSpreadsheet("getActiveSelection");
getActiveSelectionCellRangeFormat

.igSpreadsheet( "getActiveSelectionCellRangeFormat" );
activeCell の書式を取得し、アクティブな選択の全体に変更を適用するために使用されるオブジェクトを返します。
このオブジェクトに対するすべての変更は、選択対象のすべてのオブジェクトに影響を与えます。たとえば、Font.Name が「Arial」を返す場合があります。これは、他のセルが別のフォントを使用していても、アクティブセルには、このフォントが解決されたフォント名として指定されるためです。ただし、このオブジェクトの Font.Name を「Arial」に設定した場合、選択の影響を受けるすべてのオブジェクトの Font.Name はその値に更新されます。
コードサンプル

var activeSelectionCellRangeFormat = $(".selector").igSpreadsheet("getActiveSelectionCellRangeFormat");
getActiveTable

.igSpreadsheet( "getActiveTable" );
フォーカスを受けたテーブルを表すオブジェクトを返します。
コードサンプル

var activeTable = $(".selector").igSpreadsheet("getActiveTable");
getCellEditMode

.igSpreadsheet( "getCellEditMode" );
現在の編集モード状態を示すために使用する列挙体を返します。
コードサンプル

var cellEditMode = $(".selector").igSpreadsheet("getCellEditMode");
getIsInEditMode

.igSpreadsheet( "getIsInEditMode" );

返却型:

bool
コントロールが現在 activeCell の値を編集しているかどうかを示すブール値を返します。
コードサンプル

var isInEditMode = $(".selector").igSpreadsheet("getIsInEditMode");
getIsRenamingWorksheet

.igSpreadsheet( "getIsRenamingWorksheet" );

返却型:

bool
ユーザーがアクティブなワークシートの名前を編集しているかどうかを示すブール値を返します。
コードサンプル

var isRenamingWorksheet = $(".selector").igSpreadsheet("getIsRenamingWorksheet");
getPanes

.igSpreadsheet( "getPanes" );
activeWorksheet のペインの配列を返します。

returnType="ig.spreadsheet.SpreadsheetPane[]"
コードサンプル

var panes = $(".selector").igSpreadsheet("getPanes");
showFilterDialogForTable

.igSpreadsheet( "showFilterDialogForTable", worksheetTableColumn:object, spreadsheetFilterDialogOption:object );
activeTable の filterSettings の指定した相対列でフィルターダイアログを表示します。
- worksheetTableColumn
- タイプ:object
- フィルターを表示するか、変更する領域。
- spreadsheetFilterDialogOption
- タイプ:object
- フィルターダイアログの最初表示を指定するオプションの列挙体。
コードサンプル

var table = $(".selector").igSpreadsheet("option", "activeTable");
var executed = $(".selector").igSpreadsheet("showFilterDialogForTable", table.columns(0));
showFilterDialogForWorksheet

.igSpreadsheet( "showFilterDialogForWorksheet", relativeColumnIndex:number, spreadsheetFilterDialogOption:object );
activeWorksheet の filterSettings の指定した相対列でフィルターダイアログを表示します。
- relativeColumnIndex
- タイプ:number
- アクティブワークシートの領域に相対する 0 から始まる列インデックス。
- spreadsheetFilterDialogOption
- タイプ:object
- フィルターダイアログの最初表示を指定するオプションの列挙体。
コードサンプル

var executed = $(".selector").igSpreadsheet("showFilterDialogForWorksheet", 0);
showTopOrBottomDialogForTable

.igSpreadsheet( "showTopOrBottomDialogForTable", worksheetTableColumn:object );
activeWorksheet の filterSettings の指定した相対列で上位/下位ダイアログを表示します。
- worksheetTableColumn
- タイプ:object
- フィルターが表示または変更される領域。
コードサンプル

var table = $(".selector").igSpreadsheet("option", "activeTable");
var executed = $(".selector").igSpreadsheet("showTopOrBottomDialogForTable", table.columns(0));
showTopOrBottomDialogForWorksheet

.igSpreadsheet( "showTopOrBottomDialogForWorksheet", relativeColumnIndex:number );
activeWorksheet の filterSettings の指定した相対列で上位/下位ダイアログを表示します。
- relativeColumnIndex
- タイプ:number
- アクティブワークシートの領域に相対する 0 から始まる列インデックス。
コードサンプル

var executed = $(".selector").igSpreadsheet("showTopOrBottomDialogForWorksheet", 0);
styleUpdated

.igSpreadsheet( "styleUpdated" );
メニューの描画で使用されるスタイル設定情報が更新された可能性があることをスプレッドシートに通知します。
コードサンプル

var executed = $(".selector").igSpreadsheet("styleUpdated");

ui-igspreadsheet-activatenexthiddentab

次のビューから出るタブをアクティブ化するために使用されるタブ項目領域ボタンに適用されるクラスを取得します。
ui-igspreadsheet-activateprevioushiddentab

以前のビューから出るタブをアクティブ化するために使用されるタブ項目領域ボタンに適用されるクラスを取得します。
ui-igspreadsheet-addnewworksheet

新しいワークシートを作成するために使用されるタブ項目領域ボタンに適用されるクラスを取得します。
ui-igspreadsheet-automaticgridline

カスタム色が指定されていない場合、行および列の間の線を描画するために使用されるスタイル情報のクラスを取得します。
ui-igspreadsheet-cellselection

選択長方形を描画するために使用されるスタイル情報のクラスを取得します。
ui-igspreadsheet-cellselectionhandle

選択長方形のグリップハンドルを描画するために使用されるスタイル情報のクラスを取得します。
ui-igspreadsheet-columnheader

列ヘッダーを描画するために使用されるスタイル情報のクラスを取得します。
ui-igspreadsheet-columnheaderarea

列ヘッダーが描画される要素に適用されるクラスを取得します。
ui-igspreadsheet-columnheader-hover

マウスがヘッダーの上にある場合に列ヘッダーを描画するために使用されるスタイル情報のクラスを取得します。
ui-igspreadsheet-columnheader-selected

列が選択されている場合に列ヘッダーを描画するために使用されるスタイル情報のクラスを取得します。
ui-igspreadsheet-columnheader-selectedcells

列で複数のセルが選択されている場合に列ヘッダーを描画するために使用されるスタイル情報のクラスを取得します。
ui-igspreadsheet-columnsplitter

ワークシートが水平方向に分割された場合に表示される垂直のスプリッターバーに適用されるクラスを取得します。
ui-igspreadsheet-columnsplitterpreview

垂直の列スプリッターをドラッグするときに表示される要素に適用されるクラスを取得します。
ui-igspreadsheet-dropdownbutton

セルおよびヘッダー内のドロップダウンボタンに適用されるクラスを取得します。
ui-igspreadsheet-dropdownbutton-open

ドロップダウンが展開されたときにセルおよびヘッダー内のドロップダウンボタンに適用されるクラスを取得します。
ui-igspreadsheet-filter-dialog

フィルターダイアログに適用されるクラスを取得します。
ui-igspreadsheet-filter-buttons

[OK] および [キャンセル] ボタンに適用されるクラスを取得します。
ui-igspreadsheet-filter-dialog-column-name

フィルターされている列の名前に適用されるクラスを取得します。
ui-igspreadsheet-filter-dialog-condition1

最初の条件に適用されるクラスを取得します。
ui-igspreadsheet-filter-dialog-condition2

最初の条件に適用されるクラスを取得します。
ui-igspreadsheet-filter-dialog-conditional-operator

条件付きの演算子のラジオボタンに適用されるクラスを取得します。
ui-igspreadsheet-filter-dialog-hint-text

ヒントテキストに適用されるクラスを取得します。
ui-igspreadsheet-filter-dialog-show-rows-where

フィルターダイアログの「行の表示:」ラベルに適用されるクラスを取得します。
ui-igspreadsheet-formatcells-dialog

FormatCells ダイアログに適用されるクラスを取得します。
ui-igspreadsheet-formatcells-dialog-buttons

[OK] および [キャンセル] ボタンに適用されるクラスを取得します。
ui-igspreadsheet-formatcells-dialog-colorpickerdropdownbutton

ドロップダウンカラーピッカーで使用されたボタン要素に適用されたクラスを取得します。
ui-igspreadsheet-formatcells-dialog-numericspinner

各タブのコンテンツを含んで配置するテーブル要素に適用されるクラスを取得します。
ui-igspreadsheet-formatcells-dialog-tab

各タブに適用されるクラスを取得します。
ui-igspreadsheet-formatcells-dialog-table

各タブのコンテンツを含んで配置するテーブル要素に適用されるクラスを取得します。
ui-igspreadsheet-formatcells-dialog-tabs

タブに適用されるクラスを取得します。
ui-igspreadsheet-formulabar

数式バーの要素を含む領域に適用されるクラスを取得します。
ui-igspreadsheet-formulabarbuttoncontainer

Enter および [キャンセル] ボタンを含む数式バー内の領域に適用されるクラスを取得します。
ui-igspreadsheet-formulabarcancelbutton

数式バー内の [キャンセル] ボタンに適用されるクラスを取得します。
ui-igspreadsheet-formulabarenterbutton

数式バー内の [Enter] ボタンに適用されるクラスを取得します。
ui-igspreadsheet-formulabarexpandbutton

数式バーの高さを展開/縮小するために使用される数式バー内のボタンに適用されるクラスを取得します。
ui-igspreadsheet-formulabarexpandbutton-open

数式バーが展開される場合、数式バーの展開ボタンに適用されるクラスを取得します。
ui-igspreadsheet-formulabartextareacontainer

数式バー内のテキスト領域を含む要素に適用されるクラスを取得します。
ui-igspreadsheet-formulabartextareasplitter

数式バーのテキスト領域をサイズ変更する要素に適用されるクラスを取得します。
ui-igspreadsheet-header-resizeline

ヘッダーがサイズ変更されている場合に表示されるプレビュー線を描画するために使用されるスタイル情報のクラスを取得します。
ui-igspreadsheet-inputmessage

現在のアクティブなセルのデータ検証からの入力メッセージを表す要素に適用されるクラスを取得します。
ui-igspreadsheet-inputmessage-content

入力メッセージのコンテンツおよび本体に適用されるクラスを取得します。
ui-igspreadsheet-inputmessage-title

入力メッセージのタイトルに適用されるクラスを取得します。
ui-igspreadsheet-invaliddata

無効なデータガイドを描画するために使用されるスタイル情報のクラスを取得します。
ui-igspreadsheet-nameboxcontainer

数式バーの名前ボックスを含む領域に適用されるクラスを取得します。
ui-igspreadsheet-nameboxsplitter

名前ボックスの幅を変更する隣の要素に適用されるクラスを取得します。
ui-igspreadsheet-rowheader

行ヘッダーを描画するために使用されるスタイル情報のクラスを取得します。
ui-igspreadsheet-rowheaderarea

行ヘッダーが描画される要素に適用されるクラスを取得します。
ui-igspreadsheet-rowheader-hover

マウスがヘッダーの上にある場合に行ヘッダーを描画するために使用されるスタイル情報のクラスを取得します。
ui-igspreadsheet-rowheader-selected

行が選択されている場合に行ヘッダーを描画するために使用されるスタイル情報のクラスを取得します。
ui-igspreadsheet-rowheader-selectedcells

行で複数のセルが選択されている場合に行ヘッダーを描画するために使用されるスタイル情報のクラスを取得します。
ui-igspreadsheet-rowsplitter

ワークシートが垂直方向に分割された場合に表示される水平のスプリッターバーに適用されるクラスを取得します。
ui-igspreadsheet-rowsplitterpreview

水平の行スプリッターをドラッグするときに表示される要素に適用されるクラスを取得します。
ui-igspreadsheet-scrollbar-button-down

下スクロールバーの矢印に適用されるクラスを取得します。
ui-igspreadsheet-scrollbar-button-left

左スクロールバーの矢印に適用されるクラスを取得します。
ui-igspreadsheet-scrollbar-button-right

右スクロールバーの矢印に適用されるクラスを取得します。
ui-igspreadsheet-scrollbar-button-up

上スクロールバーの矢印に適用されるクラスを取得します。
ui-igspreadsheet-scrollbar-horizontal

水平スクロールバーに適用されるクラスを取得します。
ui-igspreadsheet-scrollbar-thumb-horizontal

垂直スクロールバーのつまみに適用されるクラスを取得します。
ui-igspreadsheet-scrollbar-thumb-vertical

水平スクロールバーのつまみに適用されるクラスを取得します。
ui-igspreadsheet-scrollbar-track-down

上ボタンおよびスクロールバーつまみの間にあるトラックに適用されるクラスを取得します。
ui-igspreadsheet-scrollbar-track-left

左ボタンおよびスクロールバーつまみの間にあるトラックに適用されるクラスを取得します。
ui-igspreadsheet-scrollbar-track-right

右ボタンおよびスクロールバーつまみの間にあるトラックに適用されるクラスを取得します。
ui-igspreadsheet-scrollbar-track-up

上ボタンおよびスクロールバーつまみの間にあるトラックに適用されるクラスを取得します。
ui-igspreadsheet-scrollbar-vertical

垂直スクロールバーに適用されるクラスを取得します。
ui-igspreadsheet-scrollfirsttab

最初のタブにスクロールするために使用されるタブ項目領域ボタンに適用されるクラスを取得します。
ui-igspreadsheet-scrolllasttab

最後のタブにスクロールするために使用されるタブ項目領域ボタンに適用されるクラスを取得します。
ui-igspreadsheet-scrollnexttab

次のタブにスクロールするために使用されるタブ項目領域ボタンに適用されるクラスを取得します。
ui-igspreadsheet-scrollprevioustab

以前のタブにスクロールするために使用されるタブ項目領域ボタンに適用されるクラスを取得します。
ui-igspreadsheet-selectall

行および列ヘッダー領域の交差にある [すべて選択] ボタンに適用されるクラスを取得します。
ui-igspreadsheet-sort-dialog

並べ替えダイアログに適用されるクラスを取得します。
ui-igspreadsheet-sort-dialog-add-level-button

並べ替えダイアログの [レベルの追加] ボタンに適用されるクラスを取得します。
ui-igspreadsheet-sort-dialog-copy-level-button

並べ替えダイアログの [レベルのコピー] ボタンに適用されるクラスを取得します。
ui-igspreadsheet-sort-dialog-delete-level-button

並べ替えダイアログの [レベルの削除] ボタンに適用されるクラスを取得します。
ui-igspreadsheet-sort-dialog-move-down-button

並べ替えダイアログの [下へ移動] ボタンに適用されるクラスを取得します。
ui-igspreadsheet-sort-dialog-move-up-button

並べ替えダイアログの [上へ移動] ボタンに適用されるクラスを取得します。
ui-igspreadsheet-sort-dialog-my-data-has-headers-checkbox

並べ替えダイアログの [オプション] ボタンに適用されるクラスを取得します。
ui-igspreadsheet-sort-dialog-ok-cancel-buttons-area

[OK] および [キャンセル] ボタンに適用されるクラスを取得します。
ui-igspreadsheet-sort-dialog-options-button

並べ替えダイアログの [オプション] ボタンに適用されるクラスを取得します。
ui-igspreadsheet-sort-dialog-sort-condition-active-row

アクティブな並べ替え条件行に適用されるクラスを取得します。
ui-igspreadsheet-sort-dialog-sort-condition-row

並べ替え条件行に適用されるクラスを取得します。
ui-igspreadsheet-sort-dialog-sort-conditions-area

並べ替えダイアログの [下へ移動] ボタンに適用されるクラスを取得します。
ui-igspreadsheet-sort-dialog-column-header

並べ替えダイアログの列ヘッダーに適用されるクラスを取得します。
ui-igspreadsheet-sort-dialog-top-buttons-area

並べ替えダイアログの上ボタンのグループに適用されるクラスを取得します。
ui-igspreadsheet-sort-options-dialog-case-sensitive-checkbox-area

並べ替えオプションのダイアログの [大文字と小文字を区別する] チェックボックスに適用されるクラスを取得します。
ui-igspreadsheet-sort-options-dialog-ok-cancel-buttons-area

[OK] および [キャンセル] ボタンに適用されるクラスを取得します。
ui-igspreadsheet-sort-optins-dialog-orienation-area

並べ替えオプションのダイアログの [方向] 領域に適用されるクラスを取得します。
ui-igspreadsheet-splitterintersection

垂直の列スプリッターをドラッグするときに表示される要素に適用されるクラスを取得します。
ui-igspreadsheet

メイン要素に適用されるクラスを取得します。
ui-igspreadsheet-tabareabackground

タブ領域の後ろにある要素に適用されるクラスを取得します。
ui-igspreadsheet-tabareaborder

タブ領域およびスプレッドシートペイン領域を分割する要素に適用されるクラスを取得します。
ui-igspreadsheet-tabareasplitter

タブ領域のサイズを変更するタブ領域および列スクロールバーの間にある要素に適用されるクラスを取得します。
ui-igspreadsheet-tabdropindicator

新しい位置を示すためにタブのドラッグで表示される要素に適用されるクラスを取得します。
ui-igspreadsheet-tabitem

ワークシートのタブを表す要素に適用されるクラスを取得します。
ui-igspreadsheet-tabitem-active

ワークシートのアクティブなタブを表す要素に適用されるクラスを取得します。
ui-igspreadsheet-tabitemarea

タブボタンおよび項目が描画される要素に適用されるクラスを取得します。
ui-igspreadsheet-tabitemcontent

ワークシートのタブのコンテンツを含む要素に適用されるクラスを取得します。
ui-igspreadsheet-tabitem-dark

割り当てられた色がダーク色として計算される場合にワークシートのタブのコンテンツを含む要素に適用されるクラスを取得します。
ui-igspreadsheet-tabitem-light

割り当てられた色がライト色として計算される場合にワークシートのタブのコンテンツを含む要素に適用されるクラスを取得します。
ui-igspreadsheet-tabitem-protected

保護されるワークシートのタブを表す要素に追加されるクラスを取得します。
ui-igspreadsheet-tabitem-selected

選択されているがアクティブではないワークシートタブを表す要素に適用されるクラスを取得します。
ui-igspreadsheet-tooltip ui-tooltip ui-widget-content ui-corner-all

スプレッドシートのツールチップに適用されるクラスを取得します。
ui-igspreadsheet-tooltip-body

スプレッドシートのツールチップの本体/コンテンツに適用されるクラスを取得します。
ui-igspreadsheet-tooltip-title

スプレッドシートのツールチップのタイトルに適用されるクラスを取得します。
ui-igspreadsheet-toporbottom-dialog

フィルターダイアログに適用されるクラスを取得します。
ui-igspreadsheet-toporbottom-buttons

[OK] および [キャンセル] ボタンに適用されるクラスを取得します。
ui-igspreadsheet-toporbottom-dialog-input-area

TopOrBottom ダイアログの入力領域に適用されるクラスを取得します。
ui-igspreadsheet-toporbottom-dialog-show

TopOrBottom ダイアログの [表示] ラベルに適用されるクラスを取得します。
ui-html5-non-html5-supported-message ui-helper-clearfix ui-html5-non-html5

スプレッドシートを HTML5 と互換性のないブラウザーで開いたときに表示されるメイン要素に適用されるクラスを取得します。

Ignite UI for jQuery | API リファレンス

ui.igSpreadsheet

コード サンプル

関連サンプル

関連トピック

依存関係

継承

コードサンプル