1

ExtJs 4を使用しており、西の領域にツリーパネルがあり、中央の領域にTreeGridパネルがあります。ツリーパネル(西)の選択時にTreeGridパネル(中央領域)をフィルタリングする方法はありますか?

私は次のことを試しましたが、運がありませんでした:

Ext.define('MyApp.view.MyViewport', {
    extend: 'MyApp.view.ui.MyViewport',

 initComponent: function() {

        var me = this;
        me.callParent(arguments);   
        me.down('#westTreePanel').getSelectionModel().on('selectionchange',me.CenterTreeFilter,me);

}, //end of initComponent

CenterTreeFilter: function(){

    var selection = this.down('#westTreePanel').getView().getSelectionModel().getSelection()[0];
    var centerTreeGrid = this.down('#centerTreeGrid');
    console.log(selection.data.text);

    centerTreeGrid.store.filterBy(function(rec, id){
         console.log(rec);
         return (rec.store("text") == selection.data.text);
    });
    console.log("sub store : " + this.down('#centerTreeGrid').getStore().storeId);      
    }

});
4

2 に答える 2

1

この問題と何日も戦った後、満足のいく方法ではありませんでしたが、ようやく機能を手に入れることができました. また、現在、リーフ ノードのみが非表示になっています。

「テキスト」に言及していないすべてのノードをフィルタリングします。

t.getRootNode().cascadeBy(function(n){
    if (!n.hasChildNodes() && 
        n.raw && n.raw.text.toLowerCase().indexOf(text.toLowerCase()) < 0) {
        toRemove.push({ node: n, parent: n.parentNode });
    }
});

後で復元するには、次を実行します。

function restoreTrees() {
    for (var n in toRemove) {
        toRemove[n].parent.appendChild(toRemove[n].node);
    }
    toRemove = [];
}

このソリューションには多くの欠陥があります。復元されたツリーは、おそらくそれらのノードの順序が異なることを含めて。でもねえ、少なくともこれはいくらかの進歩です。

より良いものを見たいです!(Ext JS 3 では問題なく動作していましたが、今ではこれらのくそったれノードには .ui.hide() 関数がありません)。

于 2011-12-08T05:59:53.803 に答える
0

私は彼らの例http://dev.sencha.com/deploy/ext-4.0.2a/examples/tree/treegrid.htmlをチェックしました、実際、ここでの問題は、treeGridのストアがそうでないツリーストアであるということです;メソッドfilterByがない場合、メソッドfilterByはext.data.storeで定義され、treeStoreはext.data.abstractStore ..を拡張します。ご覧のとおり、treeStoreのfilters構成を使用して、フィルターを異なる方法で適用する必要があります。フィルタを定義し、filterOnLoadをtrueに設定し、filterByメソッドを呼び出す代わりにcenterTreeGrid.store.fireEvent('load'、selection)を実行できます。これがお役に立てば幸いです

編集 私はツリーストアにフィルターを使用していませんが、このようなことができると思います

var treeFilter = new Ext.util.Filter({
    filterFn: function(rec) {
    console.log(rec);
    return (rec.store("text") == selection.data.text);
});

そして、フィルターをinitComponentのtreeStoreに割り当てます

 centerGrid.store.filters.add(treeFilter);
 centerGrid.store.filterOnLoad = true;

そしてCenterTreeFilter関数で

 centerGrid.store.fireEvent('load',selection);

Psコードはテストされておらず、おそらくいくつかの変更が必要になりますが、これがその方法だと思います。

于 2011-09-10T09:41:24.810 に答える