Question

您好我从我的sencha mvc extjs创建了一个代码我有一个网格，假设有5列公司，网站，用户名，标签，登录按钮

查看源代码：

    Ext.define('OC.view.Container', {
    extend: 'Ext.container.Viewport',
    layout: 'border',

    initComponent : function(){     
        document.getElementById('id').value = "John";
        this.items = [{
            xtype: 'panel',
            region: 'north',
            height: 25,
            bodyPadding : 5,
            baseCls : 'x-plain',
            html : 'Welcome ' + document.getElementById('id').value + '!'
        }, {
            xtype: 'panel',
            region: 'center',
            layout: 'fit',
            items: [{
                xtype : 'credentials',
                border: false
            }]
        }];

        this.callParent(arguments);
    }

});

Ext.define('OC.view.Credentials', {
    extend: 'Ext.grid.Panel',
    alias: 'widget.credentials',
    store : 'Credentials',

    initComponent : function(){

        this.columns = [{
            xtype : 'rownumberer'
        }, {
            text : 'Company',
            dataIndex : 'company',
            flex : 1
        }, {
            text : 'Website',
            dataIndex : 'website',
            flex : 1
        }, {
            text : 'Username',
            dataIndex : 'username'
        }, {
            text : 'Tabs',
            dataIndex : 'id',
            width : 30,
            flex: 1,
            editor : {
                xtype : 'textfield',
                allowBlank : false
            }
        }, {
            text : 'Login',
            xtype : 'actioncolumn', 
            width : 70,
            items : [
            {
                icon : '../js/main/login.png',
                tooltip : 'Click to Login',
                handler : function(grid, rowIndex, colIndex) {
                    var rec = grid.getStore().getAt(rowIndex);                  
                    this.url = rec.get('website');
                    this.cTabs = rec.get('id');
                    var data = {
                        username : '',
                        password : '',
                        company : rec.get('company')
                    };

                    for(var i = 1; i <= this.cTabs; i++) 
                    {
                        chrome.tabs.create({
                            url : this.url,
                            selected : true 
                        }, 
                        function(tab) {
                            var tabID = tab.id;
                            chrome.tabs.executeScript(null, {                           
                                file: 'js/main/funct.js',
                                code : 'func.login('+ JSON.stringify(data) +')'
                                //runAt : 'document_idle'
                            });
                            /*
                            chrome.tabs.update(tab.id, {
                            selected : true
                            }); */
                        });
                    }
                }
            }]
        }], <-- starts
        selType : 'cellmodel',
        plugins: [
            Ext.create('Ext.grid.plugin.CellEditing', {
                clicksToEdit : 1
            })
        ],
        height : 200,
        width : 400,
        renderTo : Ext.getBody();
        this.callParent(arguments); <-- end
    }    
});

模型源代码：

    Ext.define('OC.model.Credentials', {
    extend: 'Ext.data.Model',
    fields: [{
        name : 'website',
        type : 'string'
    }, {
        name : 'username',
        type : 'string'
    }, {
        name : 'company',
        type : 'string' 
    }, {
        name : 'id',
        type : 'integer'    
    }]
});

Ext.define('OC.store.Credentials', {
    extend: 'Ext.data.Store',
    model : 'OC.model.Credentials',
    queryMode : 'remote',
    proxy : {
        type : 'ajax',
        url: 'http://localhost/oc2/user_info/company_credentials',
        reader: {
            type: 'json',
            root: 'data'
        }       
    },
    autoLoad : true
});

控制器源代码：

Ext.define('OC.controller.Credentials', {
    extend: 'Ext.app.Controller',

    models: [
        'Credentials'
    ],

    stores: [
        'Credentials'
    ],

    views : [
        'Credentials'
    ],

    init : function() {
        this.control({
            'credentials' : {
                render : this.onCredentialsRendered         
            }
        })
    },

    onCredentialsRendered : function(grid){
        grid.store.loadPage(1);
    }
});

如果我从底部的开始到结束代码使用该代码并以半列结束它然后显示它意味着我确实在该代码上有错误但是如参考中所述我在这里研究了这个 - - ＆GT; http://docs.sencha.com/extjs/4.1.3/#!/api/Ext.grid.plugin.CellEditing

它几乎是一样的我检查代码3甚至尝试转移它可能一些调试就像把那组代码开始结束在“标签”功能旁边的顶部因为我想要的“标签”字段网格是可编辑的还是文本字段/文本框可以帮助我解决我的代码错误吗？

Answer 1

这不起作用的原因是你混淆了config和initComponent这是一个函数。

列是网格配置，不需要包含在initComponent函数中。我根本不认为需要initComponent，但也许我错过了一些东西。我会将你的定义简化为：

Ext.define('OC.view.Credentials', {
    extend: 'Ext.grid.Panel',
    alias: 'widget.credentials',
    store : 'Credentials',
// remove initComponent
    columns: [{
        xtype : 'rownumberer'
    }, {
// ...
    }],
    selType : 'cellmodel',
    plugins: [{ // You don't need to instantiate cell editor. 
        ptype: 'cellediting',
        clicksToEdit : 1
    }],
    height : 200,
    width : 400,
    renderTo : Ext.getBody();
})

在Sencha extjs中创建文本字段时，不会显示表单

1 个答案: