ExtJS 4 - 网格中的数据不可见

Posted 2023-03-16

【中文标题】ExtJS 4 - 网格中的数据不可见

【英文标题】：ExtJS 4 - Data in the grid not visible

【发布时间】：2011-11-29 17:30:32

【问题描述】：

我有一个带有以下代码的简单网格（以及商店和模型的代码）。

var containerDetailsGrid = Ext.create('Ext.grid.Panel', 
    store: storeVarContainerDetails,
    tbar:[
        
            xtype:'tbtext',
            text:'Container Details'
        
    ],
    columns: [
        
            header     : 'Ctr Size',
            flex     : 1,
            dataIndex: 'ctrSize',
            autoExpand:true,
            align:'center'
        
    ],
    height: 100
);

var storeVarContainerDetails = Ext.create('Ext.data.Store', 
    model: 'VoyageMonitoringContainerDetailsModel',
    proxy: 
        type: 'ajax',
        url: 'http://localhost/pnc/stores.php',
        extraParams:
            action:'containerDetails'
        ,
        reader: 
            type: 'json'
        
    ,
    autoLoad:true
);

Ext.regModel('VoyageMonitoringContainerDetailsModel', 
    extend: 'Ext.data.Model',
    fields: [
        type: 'string', name: 'ctrSize'
    ]
);

商店正在加载并获取数据，但这些数据没有显示或实际上在网格中可见。

当我检查 DOM 中的网格元素时，我可以看到网格表的“td”中存在数据，但该数据没有显示出来。

页面上还有其他网格，但除此之外，所有网格都显示数据。此外，控制台中也没有错误。

谁能解释一下为什么会发生这种情况？附上屏幕截图，更清晰。

PS：我使用的是 ExtJS 4。

【问题讨论】：

我已经找到了这背后的原因。当我将这个网格作为表单中的一个容器项目提供时，数据没有被显示，但是如果我将此网格作为表单中的字段集的一个项目提供，那么数据将被显示。虽然问题现在已经解决了，但是谁能分享这种行为背后的原因？

你好 Netemp，我在将数据加载到网格时遇到问题，当我在 Store 中硬编码数据时显示数据，但是当我使用与服务器数据通信的代码时没有显示你能帮帮我吗?

我有这样的服务localhost:8080/Petcrumbs/member/getMemberList 请求参数：“pageNumber”：5 响应成功：“listOfMembers”：[“name”：“Test Mmber4”，“password”：“ 287974", "gender": "Male", "joinedDate": "09-17-2013" ], "message": "会员检索成功。", "success": true

在 Extjs4 中我使用了 In EXTJS Store Ext.define('PetCrumbs.store.Members', extend : 'Ext.data.ArrayStore', model : 'PetCrumbs.model.Member', autoLoad ：true，//storeId：'Data'，代理： type：'ajax'，url：'/Petcrumbs/member/getMemberList'，方法：'POST'，标题：'Content-Type'：'application/json ', 'Accept' : 'application/json' , jsonData : pageNumber : "5" , reader : type : 'json', root: 'listOfMembers', successProperty: 'success' );请帮我看看上面的代码有什么问题？

@Ram：我建议您将您的问题作为一个新问题发布，因为您面临的问题不同。另外，在问题中添加一些代码，以便您得到帮助。

【参考方案1】：

在此处发布解决方案作为答案，以便它可以帮助寻找相同问题的人，而且我可以将此问题标记为已回答。解决方案是 - 网格不应成为表单中容器的子级，而应成为表单中 fieldset 的子级。我不知道这背后的原因，但对我来说效果很好。希望这对其他人也有帮助。

【参考方案2】：

你在你的商店试过这个吗？

      autoLoad :true

【讨论】：

好吧，autoLoad:true 就在那里。此外，正如我在上面的评论中提到的，我已经能够解决这个问题，尽管我无法确定导致它的确切原因。