问题:

I made the following extjs code, but I get the error "cannot read property 'dom' of null" when I add the properties 'width' and 'height'
However the button is well resized and the table is working fine, but cause of this error my dropdown menu doesn't work properly.

Does anybody know how to solve it ?

<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>

回答1:

It's not coming from the button config. The error is emanated from

renderTo: 'tab-content'

In your code that the id of your grid is

'tab-content'

And you are trying to render the same element to the element that you are creating. Make sure that you provide the right element id to which you want to render this grid. If not to any element then just assign

renderTo: Ext.getBody()

Refer renderTo for more info.

回答2:

I found the error thanks to this post :

https://www.sencha.com/forum/showthread.php?246181-TypeError-el-is-null-el-el.dom-Ext.getDom(el)-in-ext-all-dev.js-(ligne-19839)

转载请标明出处:Extjs cannot read property error

文章来源: Extjs cannot read property error

标签

ext