ここでは、コード例とともに、igTree
™ コントロールのノードの追加/削除に関するトランザクション ログを読み出す方法を説明します。
このトピックを理解するために、以下のトピックを参照することをお勧めします。
igTree
コントロールのノードをプログラム的に追加/削除する方法を説明します。このトピックは、以下のセクションで構成されます。
トランザクション ログは igTree
から追加や削除したノードに関する情報を保管しています。情報は、JSON オブジェクトを収容した配列に保管します。各 JSON オブジェクトには操作のタイプ (addnode
文字列値と removenode
文字列値のプロパティ) と、ノード テキストなどのノード データがあります。igTree
コントロールはそのトランザクション ログの読み出しをサポートしています。トランザクション ログの読み出しは transactionLog メソッドで行います。このメソッドは、操作のタイプとノード データを収めた JSON オブジェクトを返します。
この例のコードでは、トランザクション ログの読み出しと、HTML 出力の解析を紹介します。HTML 出力では、ノードの追加や削除などの操作のタイプとノード テキストを出力します。
この手順を行うには、以下が必要です。
igTree
コントロール のインスタンスigTree
ではノードの追加/削除操作を 1 回以上は実行します。このプレビューの図では、この例のコードで読み出して、HTML に変換し、その付属ツリーに表示したトランザクション ログを紹介します。
このコードはプレースホルダーに配置して、HTML ページでトランザクション ログを表示します。
JavaScript の場合:
// parsing transaction log arguments to a string
function parseData(data) {
var string = "", i;
if (data.length) {
for (i = 0; i < data.length; i++) {
string += data[i].Text + (i < data.length - 1 ? ", " : "");
}
} else {
string += data.Text;
}
return string;
}
var log = $("#tree").igTree("transactionLog");
var html = "";
for (i = 0; i < log.length; i++) {
html += "<p>" + log[i].type + " " + parseData(log[i].tdata.data)
+ "</p>";
}
このトピックの追加情報については、以下のトピックも合わせてご参照ください。
API リンク (igTree): ここでは、igTree コントロールの jQuery と MVC API までのリンクを紹介します。
ノード追加/削除の概要と例 (igTree): ここでは、コード例とともに、igTree
コントロールのノードをプログラム的に追加/削除する方法を説明します。
このトピックについては、以下のサンプルも参照してください。
igTree
API を使用する方法を紹介します。オンラインで表示: GitHub