如何防止在树面板中创建gridscroller?

时间:2012-08-26 04:24:17

标签: extjs

我有以下代码在树存储中创建可扩展树面板。我的问题是,autoscroll为true并且滚动为true我已经有了一个滚动条。

当我在树中展开文件夹时,会创建一个gridscroll并将其附加到主容器并排创建两个滚动条。

如何捕获展开文件夹并阻止网格滚动器呈现?

我认为列上有setAutoScroll(false)方法,但我无法弄清楚如何设置它。

Ext.Loader.setConfig({
    enabled: true,
    disableCaching: false
});
Ext.require(['Ext.form.*', 'Ext.tree.*', 'Ext.grid.*', 'Ext.data.*', 'Ext.util.*', 'Ext.tip.QuickTipManager', 'Ext.ux.grid.FiltersFeature', 'Ext.ModelManager']);

Ext.onReady(function() {
    Ext.define('model1', {
        extend: 'Ext.data.Model',
        fields: [{
            name: 'text',
            type: 'string'
        }, {
            name: 'pathInfo',
            type: 'string'
        }]
    });

    storeAddTo = Ext.create('Ext.data.TreeStore', {
        model: 'model1',
        folderSort: true,
        root: {
            expanded: true,
            children: myJSONTextAddTo
        }
    });

    var treeConfigAddTo = {

        //title: 'Select an existing folder from the list',
        id: 'grid-foldersAddTo',
        width: 320,
        height: 330,
        store: storeAddTo, //
        rootVisible: false,
        useArrows: true,
        singleExpand: false,
        renderTo: 'grid-foldersAddTo',
        columns: [{
            xtype: 'treecolumn',
            text: 'Folders',
            flex: 1,
            sortable: false,
            dataIndex: 'text',
            filterable: false
        }],
        viewConfig: {
            autoScroll: true,
            scroll: true,
        }
    }

    treeAddTo = Ext.create('Ext.tree.Panel', treeConfigAddTo);

});
  

数据(myJSONTextAddTo)

[{
    text: "Cars",
    "pathInfo": "Cars",
    children: [{
        text: "Luxury",
        "pathInfo": "Cars\\Luxury\\Bentley",
        children: [{
            text: "Bentley",
            "pathInfo": "Cars\\Luxury\\Bentley",
            children: []
        }, {
            text: "Porsche",
            "pathInfo": "Cars\\Luxury\\Porsche",
            children: [{
                text: "Cars",
                "pathInfo": "Cars\\Luxury\\Porsche\\Cars\\Luxury\\Porsche",
                children: [{
                    text: "Luxury",
                    "pathInfo": "Cars\\Luxury\\Porsche\\Cars\\Luxury\\Porsche",
                    children: [{
                        text: "Porsche",
                        "pathInfo": "Cars\\Luxury\\Porsche\\Cars\\Luxury\\Porsche",
                        children: []
                    }]
                }]
            }]
        }]
    }, {
        text: "Dealers",
        "pathInfo": "Cars\\Dealers",
        children: []
    }, {
        text: "Ferrari",
        "pathInfo": "Cars\\Ferrari",
        children: []
    }, {
        text: "Sports",
        "pathInfo": "Cars\\Sports",
        children: [{
            text: "Chevy",
            "pathInfo": "Cars\\Sports\\Chevy",
            children: []
        }]
    }, {
        text: "mycar",
        "pathInfo": "Cars\\mycar",
        children: []
    }, {
        text: "test2",
        "pathInfo": "Cars\\test2",
        children: []
    }, {
        text: "test3",
        "pathInfo": "Cars\\test3",
        children: []
    }, {
        text: "test4",
        "pathInfo": "Cars\\test4",
        children: []
    }, {
        text: "test5",
        "pathInfo": "Cars\\test5",
        children: []
    }, {
        text: "test 6",
        "pathInfo": "Cars\\test 6",
        children: [{
            text: "Test 6.1",
            "pathInfo": "Cars\\test 6\\Test 6.1",
            children: []
        }]
    }]
}]

1 个答案:

答案 0 :(得分:2)

看看这个小提琴:http://jsfiddle.net/dbrin/Qc5XV/ 我删除了您拥有的视图配置并删除了高度约束以允许树生长。我希望你就是这样。如果要修复高度,则取消注释高度配置,树面板将在需要时自动滚动。这对我来说似乎是对的。如果是这样,您可能在树周围有其他面板给您带来问题,请让我知道布局,我们可以进一步排除故障。希望这会有所帮助。