Question

我有一个简单的网格，在sencha cmd应用程序中有两个（添加和删除）按钮作为停靠项。我想删除所选行。

我在视图中定义了网格

xtype:'app-main',
    viewModel: {
        type: 'main'
    },
    layout: 'absolute',
    autoScroll : true,
    resizable:true,
    items: [

        {
            xtype: 'gridpanel',
            x: 10,
            y: 10,
            autoScroll : true,
            renderTo: document.body,
            //height: 300,
            width: 300,
            title: 'Grid Panel',

            store: 'peopleStore',

            columns: [
                {
                    xtype: 'gridcolumn',
                    dataIndex: 'id',
                    text: 'Id'
                },
                {
                    xtype: 'gridcolumn',
                    dataIndex: 'title',
                    text: 'Title'
                },
                {
                    xtype: 'gridcolumn',
                    dataIndex: 'body',
                    text: 'Body'
                }
            ],

            dockedItems: [{
            xtype: 'toolbar',
            items:[
                    {
                        xtype: 'button',
                        x: 330,
                        y: 10,
                        scale: 'medium',
                        text: 'Add New Record',
                        handler: function() {

                            var UserStore = Ext.getStore('peopleStore');
                            UserStore.add({title: 'asd', body:'asdasd'});
                            UserStore.sync();
                            UserStore.load();
                        }
                    },

                    {
                        xtype: 'button',
                        scale: 'medium',
                        text:  'Reset Records',
                        handler: function() {

                                //delete code will go here
                            }
                    }]
        }]}]

使用此stackoverflow问题extjs how to get a grid

我知道代码会像

grid.getView().getSelectionModel().getSelection()[0];
                                    if (selection) {
                                        UserStore.remove(selection);
                                    }

但有人可以告诉我如何引用“网格”吗？

Answer 1

抓住作为网格的第一个父级（相对于按钮）：

xtype: 'button',
...
handler: function(button) {
    var grid = button.up('gridpanel');
    console.log("my grid", grid);
}

抓住第一个父级（相对于按钮），它是一个网格，并且具有itemId“myGrid”（以防止歧义）：

xtype: 'gridpanel',
itemId: 'myGrid',
...
    xtype: 'button',
    ... 
    handler: function(button) {
        var grid = button.up('gridpanel #myGrid');
        console.log("myGrid", grid);
    }

我强烈建议在ExtJS中查找选择器（对于ExtJS＆lt; = 5）和ViewControllers中的引用（对于ExtJS 5）。两者都有利弊，因此我建议阅读这两者（though both do very similar things）。我的解决方案使用选择器。

以下是一些资源：

http://docs.sencha.com/extjs/5.0/application_architecture/view_controllers.html

http://training.figleaf.com/tutorials/senchacomplete/chapter2/lesson5/2.cfm http://docs.sencha.com/extjs/4.2.1/#!/api/Ext.dom.Query（完整的选择器语法列表）

如何在Sencha cmd应用程序中获取网格（任何容器）引用？

1 个答案: