是什么导致了我的dojo GridX奇怪的图形故障？

Question

我正在处理一个奇怪的故障，显示我的GridX行。在初始数据加载后更新网格数据时，我的整个GridX都不会显示，但是我发现如果我在行周围移动鼠标会触发剩下的（隐藏行）以弹出并显示。见截图：

编辑：似乎我发现当我的鼠标进入标题时，就是当所有内容都弹出时。我该如何解决这个问题？

鼠标以随机动作移过网格后：

代码：

        require([ 
                 //Require resources. 
                 "dojo/dom", 
                 "dojo/store/Memory", 
        "dijit/form/Button", 
                 "gridx/core/model/cache/Sync", 
                 "gridx/Grid", 
                 "gridx/modules/CellWidget", 
                 "dojo/domReady!" 
             ], function(dom, Memory, Button, Cache, Grid){ 

            //Use dojo/store/Memory here 
            store = new Memory({ 
                data: [ 
                    { id: 1, feedname: 'Feed4', startstop: 0, pause: '', config: ''}, 
                    { id: 2, feedname: 'Feed5', startstop: 0, pause: '', config: ''} 
                ] 
            }); 

//    TODO: I don't know what this is for: 
            //We are using Memory store, so everything is synchronous. 
            var cacheClass = "gridx/core/model/cache/Sync"; 

            var structure = [ 
                             { id: 'feedname', field: 'feedname', name: 'Feed Name', width: '110px' }, 

                             { id: 'startstop', field: 'startstop', name: 'Start/Stop', width: '61px', 
                                widgetsInCell: true, 
                                navigable: true, 
                                allowEventBubble: true, 
                                decorator: function(){ 
                                        //Generate cell widget template string 
                                        return [ 
                                                '<div style="text-align: center"><button data-dojo-type="dijit.form.Button" ', 
                                                'onClick="onStartStopButtonClick();" ', 
                                                'data-dojo-attach-point="btn" ', 
                                                'class="startStopButtonPlay" ', 
                                                'data-dojo-props="iconClass:\'startStopButtonPlayIcon\'" ', 
                                                '></button></div>' 
                                        ].join(''); 
                                }, 
                                setCellValue: function(data){ 
                                        //"this" is the cell widget 
                                        this.btn.set('label', data); 
                                } 
                            }, 

                            { id: 'pause', field: 'pause', name: 'Pause', width: '61px', 
                                widgetsInCell: true, 
                                navigable: true, 
                                allowEventBubble: true, 
                                decorator: function(){ 
                                        //Generate cell widget template string 
                                        return [ 
                                                '<div style="text-align: center"><button data-dojo-type="dijit/form/Button" ', 
                                                'onClick="onPauseButtonClick();" ', 
                                                'data-dojo-attach-point="btn2" ', 
                                                'class="pauseButton" ', 
                                                'data-dojo-props="iconClass:\'pauseIcon\'" ', 
                                                '></button></div>' 
                                        ].join(''); 
                                },                                                               
                                setCellValue: function(data){ 
                                        //"this" is the cell widget 
                                        this.btn2.set('label2', data); 
                                } 
                            }, 

                            { id: 'config', field: 'config', name: 'Config', width: '61px', 
                                widgetsInCell: true, 
                                navigable: true, 
                                allowEventBubble: true, 
                                decorator: function(){ 
                                        //Generate cell widget template string 
                                        return [ 
                                                '<div style="text-align: center"><button data-dojo-type="dijit/form/Button" ', 
                                                'onClick="onConfigButtonClick();" ', 
                                        'data-dojo-attach-point="btn3" ', 
                                                'class="configButton" ', 
                                                'data-dojo-props="iconClass:\'configIcon\'" ', 
                                                '></button></div>' 
                                        ].join(''); 
                                }, 
                                setCellValue: function(gridData, storeData, cellWidget){ 
                                        //"this" is the cell widget 
                                        cellWidget.btn3.set('label3', data); 
                                } 
                            } 
            ]; 

                 //Create grid widget. 
                grid = Grid({ 
                     id: 'grid', 
                     cacheClass: Cache, 
                     store: store, 
                     structure: structure, 
                     autoHeight: true, 
                     columnWidthAutoResize: false 
                 }); 

                 //Put it into the DOM tree. 
                 grid.placeAt('compactWidgetGrid'); 

                 //Start it up. 
                 grid.startup(); 

                 updateGridData(Memory, store); 
             }); 

function updateGridData(Memory, store){ 

    grid.model.clearCache(); 

    newStore = new Memory({ 
        // TODO: Replace data here with actual feed data received from PICTE server! 
        data: [ 
            { id: 1, feedname: 'testingThis1', startstop: 0, pause: '', config: ''}, 
            { id: 2, feedname: 'testingThis2', startstop: 0, pause: '', config: ''}, 
            { id: 3, feedname: 'testingThis3', startstop: 0, pause: '', config: ''}, 
            { id: 4, feedname: 'testingThis4', startstop: 0, pause: '', config: ''}, 
            { id: 5, feedname: 'testingThis5', startstop: 0, pause: '', config: ''}, 
            { id: 6, feedname: 'testingThis6', startstop: 0, pause: '', config: ''}, 
            { id: 7, feedname: 'testingThis7', startstop: 0, pause: '', config: ''} 
        ] 
    }); 

    // reset store 
    grid.setStore(newStore); 

    // Update grid data 
    grid.model.store.setData(newStore); 

    // Refresh the GridX 
    grid.body.refresh(); 

}

Answer 1

删除autoHeight: true,解决了这个问题。