jQuery EasyUI フォームプラグイン -Combotree コンボツリー


jQuery EasyUI 插件jQuery EasyUI プラグイン

拡張元は $.fn.combo.defaults と $.fn.tree.defaults です。$.fn.combotree.defaults を介してデフォルトの defaults を上書きします。

コンボツリー(combotree)は、選択コントロールとドロップダウンツリーを組み合わせたものです。コンボボックス(combobox)に似ていますが、リストをツリーコンポーネントに置き換えた点が異なります。コンボツリー(combotree)は、複数選択用のツリー状態チェックボックス付きのツリーをサポートしています。

依存関係

  • combo
  • tree

使用方法

マークアップからコンボツリー(combotree)を作成します。

<select id="cc" class="easyui-combotree" style="width:200px;"
    data-options="url:'get_data.php',required:true">
</select>

JavaScriptを使用してコンボツリー(combotree)を作成します。

<input id="cc" value="01">
$('#cc').combotree({
    url: 'get_data.php',
    required: true
});

プロパティ

このプロパティはコンボ(combo)とツリー(tree)から拡張されています。以下はコンボツリー(combotree)に追加または上書きされるプロパティです。

名前 型 説明 デフォルト値
editable boolean ユーザーがテキストフィールドに直接文字を入力できるかどうかを定義します。 false

イベント

このイベントはコンボ(combo)とツリー(tree)から拡張されています

メソッド

このメソッドはコンボ(combo)から拡張されています。以下はコンボツリー(combotree)に追加または上書きされるメソッドです。

名前 パラメータ 説明
options none オプション(options)オブジェクトを返します。
tree none ツリー(tree)オブジェクトを返します。次の例は、選択されたツリーノードを取得する方法を示しています。
var t = $('#cc').combotree('tree');    // get the tree object
var n = t.tree('getSelected');        // get selected node
alert(n.text);
loadData data ローカルのツリー(tree)データを記憶します。
コード例:
$('#cc').combotree('loadData', [{
    id: 1,
    text: 'Languages',
    children: [{
        id: 11,
        text: 'Java'
    },{
        id: 12,
        text: 'C++'
    }]
}]);
reload url リモートのツリー(tree)データを再度リクエストします。'url' パラメータを渡して元のURL値を上書きします。
clear none コンポーネントの値をクリアします。
setValues values コンポーネントの値の配列を設定します。
コード例:
$('#cc').combotree('setValues', [1,3,21]);
setValue value コンポーネントの値を設定します。
コード例:
$('#cc').combotree('setValue', 6);

jQuery EasyUI 插件jQuery EasyUI プラグイン その他の拡張機能