網格面板工具欄失敗的渲染文本域

我想將文本域添加到網格面板中的tbar，但它不起作用。網格面板工具欄失敗的渲染文本域

我試着用按鈕，然後它的工作原理..

此代碼不能正常工作，錯誤消息說，類型錯誤：g.el是空

var grid = Ext.create('Ext.grid.Panel', { 
... 
tbar : [ 
    { 
    xtype : 'textfield', 
    name : 'test' 
    } 
] 
});

但這種代碼工作，

var grid = Ext.create('Ext.grid.Panel', { 
... 
tbar : [ 
    { 
    xtype : 'button', 
    text : 'keyword' 
    } 
] 
});

有人知道，爲什麼發生了？

我發現，

它renderTo： 'TABLEID'，但我改renderTo：Ext.getBody（）

然後它工作。但我想把網格放到特定的html元素中，我該怎麼辦？

[編輯]

我想插入到#listTable，

<div id="wrap"> 
    <table id="listTable"></table> 
</div>

我只是想 '包裝'，那麼它的工作原理，

所以，我想，renderTo：「包> listTable'

但它不工作:(

來源

2012-11-19 Expert wanna be

下面的代碼在4.1.3中沒有任何錯誤。它可能是你的版本中的一個錯誤？您可以在API demo框之一中對其進行測試。只需複製粘貼即可。 tbar prop是dockedItem的簡寫，適用於top。通過的數組會自動插入到toolbar中。沒有更多的事情發生。因此，它必須努力

Ext.create('Ext.data.Store', { 
    storeId:'simpsonsStore', 
    fields:['name', 'email', 'phone'], 
    data:{'items':[ 
     { 'name': 'Lisa', "email":"[email protected]", "phone":"555-111-1224" }, 
     { 'name': 'Bart', "email":"[email protected]", "phone":"555-222-1234" }, 
     { 'name': 'Homer', "email":"[email protected]", "phone":"555-222-1244" }, 
     { 'name': 'Marge', "email":"[email protected]", "phone":"555-222-1254" } 
    ]}, 
    proxy: { 
     type: 'memory', 
     reader: { 
      type: 'json', 
      root: 'items' 
     } 
    } 
}); 

Ext.create('Ext.grid.Panel', { 
    title: 'Simpsons', 
    tbar: [ 
     { 
     xtype : 'textfield', 
     name : 'test' 
     } 
    ], 
    store: Ext.data.StoreManager.lookup('simpsonsStore'), 
    columns: [ 
     { text: 'Name', dataIndex: 'name' }, 
     { text: 'Email', dataIndex: 'email', flex: 1 }, 
     { text: 'Phone', dataIndex: 'phone' } 
    ], 
    height: 200, 
    width: 400, 
    renderTo: Ext.getBody() 
});

編輯

renderTo需要一個有效的id，一個HTML元素或Ext.Element

來源

2012-11-19 18:37:38 sra

謝謝你的回答，我用你的代碼替換，我發現問題是什麼，它是renderTo。但仍然找不到解決方案，請您再次查看我編輯的問題嗎？ –

@Expertwannabe不使用renderTo。將它直接放入所有者組件 – sra

的項目數組中，對不起再次提問，但仍然不明白。你能否解釋一點細節？ –

這對我在ExtJS 4.1上的工作很好，雖然我通常初始化initComponent函數中的組件（雖然我不明白爲什麼它不應該像你這樣做）。所以這可能是這樣的：

initComponent: function() { 
    this.dockedItems = [{ 
     xtype: 'toolbar', 
     items: [ {xtype:'textfield', name:'test', value:'test'} ] 
    }]; 
    this.callParent(arguments); 
}

來源

2012-11-19 18:15:36 Harel

你並不需要的initComponents內做到這一點。 – sra

你是對的，你不這樣做，我出於其他原因這麼做。無論如何 - 上述問題的代碼應該可以工作。 – Harel

網格面板工具欄失敗的渲染文本域

回答

相關問題