SlickGrid行不会显示

SlickGrid rows are not shown

本文关键字:显示 SlickGrid      更新时间:2023-09-26

我在使用简单的SlickGrid时遇到了一个问题:它不能显示数据行,但为它们留出了空间。这是我的代码:

var defaultFormatter = function (row, cell, value, columnDef, dataContext) {
        return value;
    }
var subgrid = $("#subgrid");
    var dt = new Slick.Data.DataView();
    var its = [
        { Id: "1", name: "First row", time: "15:13" }
    ];
    dt.setItems(its, "Id");
    var opts = {
        enableCellNavigation: true,
        enableColumnReorder: false
    };
var columns = [
        {
            width: 0,
            name: "Row name",
            field: "name",
            id: "name"
        },
        {
            width: 0,
            name: "Time",
            field: "time",
            id: "time"
        }
    ];
    for (var i in columns) {
        if (columns[i].width == 0)
            columns[i].width = "auto";
        columns[i].formatter = defaultFormatter;
    }

    var ogrid = new Slick.Grid("#subgrid", dt, columns, opts);
    ogrid.invalidate();
    ogrid.render();

Html代码很简单:

<div id="subgrid" class="grid-place-holder"></div>

因此,每次加载页面时,SlickGrid都只构建一个标题行和网格画布,但.grid画布中没有数据。我尝试了不同的组合,例如"ogrid.invalidateAllRows()",但都无法实现。请给我一个线索,我错在哪里了?

Upd:好的,我明白了。SlickGrid是动态渲染的,我没有设置"#subgrid"的高度。因此,在"height:auto"(对于slickgrid,height=0)的情况下,它不能渲染任何行。始终在slickgrid根元素中设置高度样式。

SlickGrid动态渲染,我没有设置"#subgrid"的高度。因此,在"height:auto"(对于slickgrid,height=0)的情况下,它不能渲染任何行。始终在slickgrid根元素中设置高度样式。