Question

我在slickgrid中遇到格式化程序的问题。没有错误或其他。我复制了教程中的几行。

格式化程序没有激活，所以它不会给我正确的类来折叠我的行

我还使用了dataView和groupItemMetadataProvider。 InlineFilters是真的

 var TaskNameFormatter = function (row, cell, value, columnDef, dataContext) {
    var spacer = "<span style='display:inline-block;height:1px;width:" + (15 * dataContext["indent"]) + "px'></span>";
    var idx = dataView.getIdxById(dataContext.id);
    if (data[idx + 1] && data[idx + 1].indent > data[idx].indent) {
        if (dataContext._collapsed)
            return spacer + " <span class='toggle expand'></span>&nbsp;" + value;
        else
            return spacer + " <span class='toggle collapse'></span>&nbsp;" + value;
    }
    else
        return spacer + " <span class='toggle'></span>&nbsp;" + value;
};
var columns = [
        { id: "title", name: "title", field: "title", resizeable: true, renderOnResize: true, width: 200, formatter: TaskNameFormatter },
        { id: "userNames", name: "userName", field: "userNames", resizeable: true, renderOnResize: true, width: 200 },
        { id: "status", name: "status", field: "status", resizeable: true, renderOnResize: true, width: 200 },
        { id: "date", name: "Date", field: "date", resizeable: true, renderOnResize: true, width: 200 }
    ];

我希望你能提供帮助。如果您需要更多代码，请告诉我，但这是我的主要问题。

Strikeheart

Answer 1

让我试着回答你可能遇到的问题。我在评论中提到你没有＆＃34;缩进＆＃34;作为列定义的一部分，但实际上我在解释它时犯了一个错误。它不一定是列定义的一部分（除非你想将它显示为列）但是它必须是您提供给网格的数据的一部分。例如，如果我们将数据作为JSON发送，它可能如下所示（请注意＆＃34;缩进＆＃34;属性作为数据的一部分）：

jsonData = { "pages" : [
    { "title" : "some title", "indent" : 15, "userNames" : "some user", "status" : "some status", "date" : "2001-01-01" },
    { "title" : "other title", "indent" : 10, "userNames" : "other user", "status" : "other status", "date" : "2001-02-02" }
]}

然后在你的脚本中，你可以（或不）将缩进显示为列，但它实际上取决于你看到它或隐藏它，但它确实必须是原始数据的一部分（在我的例子中作为JSON））。我使用getJSON()函数制作了一个快速模板，但它完全取决于您如何填充数据，我只想引导您一些示例...还请注意您的格式化程序为了在你甚至可以使用它之前声明，我通常将它们声明为外部文件，但你也可以在列定义之前声明它。

<script src="../slick.dataview.js"></script>

<script>
    // global variables
    var dataView;
    var grid;

    // define your formatter before using it, this could also be in an external JS file 
    // your JSON data, also HAS TO INCLUDE the "indent" variable
    var TaskNameFormatter = function (row, cell, value, columnDef, dataContext) {
        var spacer = "<span style='display:inline-block;height:1px;width:" + (15 * dataContext["indent"]) + "px'></span>";
        var idx = dataView.getIdxById(dataContext.id);
        if (data[idx + 1] && data[idx + 1].indent > data[idx].indent) {
            if (dataContext._collapsed)
                return spacer + " <span class='toggle expand'></span>&nbsp;" + value;
            else
                return spacer + " <span class='toggle collapse'></span>&nbsp;" + value;
        }
        else
            return spacer + " <span class='toggle'></span>&nbsp;" + value;
    };


    var columns = [
        { id: "title", name: "title", field: "title", resizeable: true, renderOnResize: true, width: 200, formatter: TaskNameFormatter },
        { id: "userNames", name: "userName", field: "userNames", resizeable: true, renderOnResize: true, width: 200 },
        { id: "status", name: "status", field: "status", resizeable: true, renderOnResize: true, width: 200 },
        { id: "date", name: "Date", field: "date", resizeable: true, renderOnResize: true, width: 200 }
    ];
    var options = {};



    // populate your grid with getJSON or any other service
    $.getJSON("http://localhost/getData", function(jsonData) {
        // initialize the dataView object 
        var groupItemMetadataProvider = new Slick.Data.GroupItemMetadataProvider();
            dataView = new Slick.Data.DataView({
            groupItemMetadataProvider: groupItemMetadataProvider
        });

        // create the grid object
        grid = new Slick.Grid("#myGrid", dataView, columns, options);
        grid.init();

        dataView.beginUpdate();
        dataView.setItems(jsonData);
        dataView.endUpdate();

        grid.updateRowCount();
        grid.render();
    });
</script>

希望这可以帮助您找到问题所在。 :) ˙实际上，另外一件事，我不确定格式化程序中的_collapsed属性，它可能也必须是数据的一部分（示例中为JSON）。

Slickgrid TaskNameFormatter不起作用

1 个答案: