3

そのため、Web サイト内に Fuel UX のツリービューを実装しました。読み込まれるたびに、必要なアイテムを手動で再選択する必要があります。各リロード後に特定のアイテムを事前に選択する可能性はありますか?

前もって感謝します！

4

3 に答える 3

2

私は昨日から同じ状況にあり、以下の解決策で問題を解決できました。このページの「ネストされたテスト項目1を選択」ボタンにあるメソッドを使用したことを説明するだけです。解決策は次のとおりです。

var preSelectFolder = function ($treeEl, folder, $parentEl) {
            var $elParent = $parentEl || $treeEl;
            if (folder.type == "folder") {
                var $folderEl = $elParent.find("div.tree-folder-name").filter(function (_, treeFolder) {
                    return $(treeFolder).text() == folder.name;
                }).parent();
                $treeEl.one("loaded", function () {
                    $.each(folder.children, function (i, item) {
                        preSelectFolder($treeEl, item, $folderEl.parent());
                    });
                });
                $treeEl.tree("selectFolder", $folderEl);
            }
            else {
                preSelectItem($treeEl, folder, $elParent);
            }
        };

        var preSelectItem = function ($treeEl, item, $parentEl) {
            var $elParent = $parentEl || $treeEl;
            if (item.type == "item") {
                var $itemEl = $elParent.find("div.tree-item-name").filter(function (_, treeItem) {
                    return $(treeItem).text() == item.name && !$(treeItem).parent().is(".tree-selected");
                }).parent();
                var itemId = $($itemEl).data() != null ? $($itemEl).data().id : "";
                if (itemId == item.id)
                    $treeEl.tree("selectItem", $itemEl);
            }
            else if (item.type == "folder") {
                preSelectFolder($treeEl, item, $elParent);
            }
        };

そして、「ロード」の場合は、次のコードを使用します。

element.on('loaded', function (e) {
            angular.forEach(scope.items, function (item) {
                preSelectItem($("#BuildTree"), item);
            });
        });

私は AngularJs を使用しているので、Jquery の各関数の「angular.forEach」を置き換えるだけで、「scope.items」は事前に選択する必要がある項目です。私の場合、アイテムは次の形式です。

[
    { name: 'Dir 1', type: 'folder', id: 'D1' },
    { name: 'Dir 2', type: 'folder', id: 'D2' },
    { name: 'Item 1', type: 'item', id: 'i1' },
    { name: 'Item 2', type: 'item', id: 'i2' }
]

それが役立つことを願っています。

于 2013-07-09T18:11:04.507 に答える
0

手動で、実際にアイテムをもう一度クリックしていることを意味する場合は、これをよりプログラム的に行う方法があるはずです。

私はそれをテストしていませんが、$('#MyTree').tree('selectItem', $el)where $elis a .tree-itemelement を呼び出すと、アイテムが選択されるはずです。

どの項目が選択されているかをデータソースがツリーに伝えることができると便利です。https://fuelux.uservoice.com/forums/181290-general/suggestions/4097231-add-preselect-option-for-treeviewに機能リクエストを投稿したようですそこに投票すると便利です。

于 2013-06-20T12:04:10.940 に答える