Extjs 无法读取属性错误答案

【问题标题】：Extjs cannot read property errorExtjs 无法读取属性错误
【发布时间】：2015-04-28 09:52:21
【问题描述】：

我编写了以下 extjs 代码，但是当我添加属性 'width' 和 'height' 时出现错误“无法读取属性 'dom' of null”
但是按钮的大小调整得很好并且表格工作正常，但由于此错误，我的下拉菜单无法正常工作。

有人知道怎么解决吗？

<div id="tab-content">
<script type="text/javascript">
Ext.onReady(function() {
    Ext.create('BVCore.Grid', {
        id:'tab-content',
        renderTo: 'tab-content',
        stateId: 'tab-content',       
        store: Ext.create('BVCore.LocalStore', {
            fields: ['hostName', 'ip', 'serialNumber', 'model', 'role', 'status', 'siteName', 'installDate', 'linkedService'],
            proxy: {
                url:  '<spring:url value="/controller/search/json/deviceSearch.json" />'               
            },
        }),
        features: [{ftype:'grouping'}],
        columns: [
                  {text: '<spring:message code="device.hostname" />', dataIndex: 'hostName', autoSizeColumn: true, align: 'center'},
                  {text: '<spring:message code="device.ipaddress" />', dataIndex: 'ip', autoSizeColumn: true, align: 'center'},
                  {text: '<spring:message code="device.sn" />', dataIndex: 'serialNumber', autoSizeColumn: true, align: 'center'},
                  {text: '<spring:message code="device.model"/>', dataIndex: 'model', autoSizeColumn: true, align: 'center'},
                  {text: '<spring:message code="device.role" />', dataIndex: 'role', autoSizeColumn: true, align: 'center'},
                  {text: '<spring:message code="device.status" />', dataIndex: 'status', autoSizeColumn: true, align: 'center'},
                  {text: '<spring:message code="device.site" />', dataIndex: 'siteName', autoSizeColumn: true, align: 'center'},
                  {text: '<spring:message code="device.installDate" />', dataIndex: 'installDate', autoSizeColumn: true, align: 'center'},
                  {text: '<spring:message code="device.linkedService" />', dataIndex: 'linkedService', autoSizeColumn: true, align: 'center'},
                  {autoSizeColumn: true, align: 'center', dataIndex: 'id',
                      renderer: function (value, metadata, record) {
                        var id = Ext.id();
                        Ext.defer(function () {
                            Ext.widget('button', {
                                renderTo: id,
                                text: 'Details',
                                width: 75,
                                height: 18,
                                handler: function () {
                                    window.location = "/netmg/controller/home/device/view/" + record.get('id');
                                }
                            });
                        }, 1);
                        return Ext.String.format('<div id="{0}"></div>', id);
                      }
                  }
              ]
    });
});
</script>
</div>

【问题讨论】：

我试过你的代码，它对我来说工作正常。不知道你为什么会遇到这样的问题。
我不认为这是因为按钮。 renderTo: 'tab-content' - 你确定 'tab-content' 已定义吗？错误来自那里。

标签： java javascript jquery extjs widget

【解决方案1】：

它不是来自按钮配置。错误来自

renderTo: 'tab-content'

在您的代码中，您的网格的 id 是

'标签内容'

您正在尝试将相同的元素呈现给您正在创建的元素。确保您提供了要呈现此网格的正确元素 id。如果不是任何元素，则只需分配

renderTo: Ext.getBody()

请参阅renderTo 了解更多信息。

【讨论】：

我编辑了我的描述，标签内容已定义。我想把网格放到这个div中
我阅读了文档，上面写着“如果组件要成为容器的子项，请不要使用此选项。容器的布局管理器负责渲染和管理其子项。”但是当我不使用 renderTo 表消失
我没有看到任何例外。请确保网格的 id 也与 div 的 id 不同。 “BVCore.Grid”是否有任何自定义更改？你能分享一下代码吗？
检查这个小提琴 - fiddle.sencha.com/#fiddle/m0o 。检查 index.html 文件。 app.js 文件为空
它是特定于浏览器的吗？