このトピックでは、igTree
™ コントロールのイベントを紹介します。
このトピックは、以下のセクションで構成されます。
以下の表に、igTree
コントロールの主なイベントの目的と機能の概要を示します。
イベント | 説明 | キャンセル可能 |
---|---|---|
dataBinding | データ バインドが実行される前に発生するイベント。 | False |
dataBound | データ バインドが実行された後に発生するイベント。 | False |
drag | ノード ドラッグで発生するイベント。 | True |
dragStart | ノード ドラッグ開始で発生するイベント。 | True |
dragStop | ドラッグ操作が完了した後に発生するイベント。 | False |
nodeCheckstateChanged | ノードのチェックステート後に発生されるイベント。 | False |
nodeCheckstateChanging | ノードのチェックボックス ステートが変更される前に発生します。 | True |
nodeClick | ノード クリックで発生するイベント。 | False |
nodeCollapsed | ノードが縮小された後に発生するイベント。 | False |
nodeCollapsing | ノードが縮小される前に発生するイベント。 | True |
nodeDoubleClick | ノード ダブル クリックで発生するイベント。 | False |
nodeDropped | ノードがドロップされた後に発生するイベント。 | False |
nodeDropping | ノードがドロップされる前に発生するイベント。 | True |
nodeExpanded | ノードが拡張された後に発生するイベント。 | False |
nodeExpanding | ノードが拡張される前に発生するイベント。 | True |
nodePopulated | ロードオンデマンドの読み込みの場合に、ノードの子が生成された後にイベントが発生します。 | False |
nodePopulating | ロードオンデマンドの読み込みの場合に、ノードの子が生成された後にイベントが発生します。 | True |
rendered | ツリーのレンダリングが終了した後にイベントが発生します。 | False |
rendering | ツリーのレンダリングが開始する前にイベントが発生します。 | False |
selectionChanged | ノードが選択された後に発生するイベント。 | False |
selectionChanging | 新しいノードが選択される前に発生するイベント。 | True |
イベントに添付するには、プロパティの定義と同じようにイベントのハンドラーを定義します。これでイベントをトリガーすると、ハンドラーが呼び出されます。
JavaScript の場合:
$("#igTree1").igTree({
selectionChanging: function (e, args) {
// Handle event
}
});
以下のサンプルは、構成方法、そしてイベント ハンドラーを指定した要素にアタッチするために必要な jQuery の on メソッドの使用を紹介します。
MVC でハンドラーを添付する場合、ハンドラーをウィジェット イベントに添付する jQuery User Interface (UI) パターンを使用します。つまり、jQuery の on
、bind
、または live
関数を使用して、イベントの名前をそれらに渡す必要があります。イベント名は、コントロールおよびイベントの名前を連結した小文字の文字列でなければなりません。jQuery ウィジェットでも同様のことができますが、コントロールを初期化するときにイベント ハンドラーを直接添付できるため、これは必要ありません。詳細は、jQuery ウィジェット ファクトリを参照してください。以下のコードは、MVC ソリューションを実装する場合にハンドラーを igTree イベントに添付する方法を示しています。
JavaScript の場合:
$("#igTree1").on({ igtreedragstart: function (e, args) {
// Handle event
}});
このトピックの追加情報については、以下のトピックも合わせてご参照ください。
オンラインで表示: GitHub