以编程方式定义时，dojo datagrid autoheight 不起作用答案

【问题标题】：dojo datagrid autoheight not working when programmatically defined以编程方式定义时，dojo datagrid autoheight 不起作用
【发布时间】：2016-01-26 22:08:17
【问题描述】：

以下代码构建了 3 个数据网格，2 个通过标记构建，一个通过代码构建。

当你按下“自动高度！”按钮仅调整标记数据网格的大小。

我不明白为什么代码数据网格不起作用。据我所见，正在初始化相同的属性。

谢谢

<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="http://js.arcgis.com/3.13/dijit/themes    /claro/claro.css">
<link rel="stylesheet" href="http://js.arcgis.com/3.13/dojox/grid/resources/claroGrid.css"> 
<script>dojoConfig = {parseOnLoad: true}</script>
<script src="http://js.arcgis.com/3.13/"></script>  
<script>require(["dojo/parser", "dijit/layout/TabContainer", "dijit/layout/ContentPane"]);</script>     
<meta charset="UTF-8">
<title>alubia</title>

<script type="text/javascript"> 
    var test_store;

    var layout = [
        {name:"id", field:"id", width: '165px', noresize: 'true'},
        {name:"data", field:"data", width: '125px', noresize: 'true'}           
    ];

    function loadData(gridId, divId) {                                      
    require(['dojo/data/ItemFileWriteStore', 'dojox/grid/DataGrid'], function(ItemFileWriteStore, DataGrid) {           
        var mi_data = { 
            items : [],
            identifier:"id"
        };                                  

        for (var i = 0; i < 22; i++) {
            mi_data.items.push({id: ""+i, data:"111 ! "+ i});           
        }       

        test_store  = new ItemFileWriteStore({data: mi_data});          

        if (divId != null) {        
            var grid = new DataGrid({
                id : gridId,
                store : test_store,
                structure : layout,
                rowSelector : '0px',
                autoHeight : false                  
            });

            grid.placeAt(divId);    
            grid.startup();
        }
    });         
    }   

    function fitHeight(gridId) {        
        var grid = dijit.byId(gridId);          
        grid.set('autoHeight', true);
        grid.set('autoWidth', false);
        grid.update();          
    }           

    loadData("grid", null);
    loadData("grid2", "grid2Div");
    loadData("grid3", null);
</script>
</head>

<body class="claro" style="font-family:sans-serif; font-size:12px;">
<button onclick="fitHeight('grid'); fitHeight('grid2'); fitHeight('grid3');">autoheight!</button>&nbsp;           

<div id="grid2Div" style="height: 7em;" ></div>
<div id="grid" style="height: 7em;"  data-dojo-id="grid" dojoType="dojox.grid.DataGrid" autoHeight="false" store="test_store" structure="layout" ></div>    
<div id="grid3" style="height: 7em;"  data-dojo-id="grid3" dojoType="dojox.grid.DataGrid" autoHeight="false" store="test_store" structure="layout" ></div>
</body>
</html>

【问题讨论】：

您有两个网格也共享相同的 data-dojo-id="grid"。你能做一个工作现场小提琴吗？你也可以调用 .resize()，但更容易看到你的问题的一部分在起作用。
@Layke 无法让它在小提琴上工作。不过，这是链接，jsfiddle.net/davidzornosa/yqhvp0sn。只需将上面的代码粘贴到一个空的 html 中，您就会看到示例工作
看来您并没有在小提琴上加载道场。我只是快速扫了一眼。 Uncaught ReferenceError: require is not defined

标签： dojo dojox.grid.datagrid

【解决方案1】：

再次强调，dojo 是一个可怕的工具。转到数据表（jquery 插件）。天又亮了。

【讨论】：