2

我有一个给定的网格。我想在每一行中放置一个属性,一个 id 值。(为了获取行标识,执行删除和编辑操作)。

我想到的最好的方法是使用格式化程序将其打印到属性中,但是我找不到将 id 传递给格式化程序函数的方法,因为格式化程序调用是列减速级别,并且我正在获取每个行 id ,在数据循环内。

怎么做?

function NameFormatter(row, cell, value, columnDef, dataContext) {
    return '<span data-user-id="'+id+'">"'+text+'"</span>';
}

columns.push({ 
   id: "name", name: "Name", field: "name", width: 180, 
   cssClass: "cellName", sortable: true, formatter:NameFormatter
})

for (var i = 0; i < list_users.length; i++) {
    data[i] = {
        /*
           What I do here?
           How do I pass list_users[i].id & 
           list_users[i].name to the formatter from here? 
        */
        name: list_users[i].name,
        role: returnRole(list_users[i].role),
        email: list_users[i].email,
        portfolios: 'no attr for now'
    };
}
4

3 回答 3

6

在此处记录代码和答案,以供将来偶然发现我的问题的任何用户使用。

SlickGrid 的逻辑是这样工作的:

  1. 定义表头和其他运行时属性(如可排序、宽度等)的列。
  2. 将您的 json 和寄存器值获取到DataView的数据循环,为我们的成员保存。
  3. 当我们使用格式化程序时,这个成员变得有用。

当您调用格式化程序时,在Columns声明中,您只需要调用格式化程序。光滑的网格将完成其余的工作。

这是我的列定义,其中我有一个 {span} 元素,其中包含值和 id,基于条件。

columns.push({ 
    id: "options", 
    name: "Options", 
    field: "options", 
    width: 110, 
    cssClass: "cellOptions slick-last-cell", 
    formatter: optionsFormatter 
})

如果一切都定义正确,格式化程序将传递条件或任何其他类型的工作所需的所有参数。

格式化程序从 dataView 接收您/我们传递的所有行参数。如果我这样定义我的数据:

for (var i = 0; i < list_users.length; i++) {
    data[i] = {
        id: list_users[i].id,
        name: list_users[i].name,
        role: returnRole(list_users[i].role),
        email: list_users[i].email,
        portfolios: 'no attr for now',
        isPending: list_users[i].isPending
    };
}

比我的 dataContext 将把这个数组放在他的手中,并将它传递给我的格式化程序,在那里我将用变量值做任何我想做的事情。

 function optionsFormatter(row, cell, value, columnDef, dataContext) {
    if (dataContext.isPending) {
        return '<span onclick="deleteUser(' + dataContext.id + ')" class="actionIcon delete">Cancel</span>';
    } else {
        return '<span onclick="editUser(' + dataContext.id + ')" class="actionIcon edit">Edit</span>';
    }
}

如您所见, id 和 isPending 在网格中对用户不可见,但它们可用于任何 dataContext。

就是这样。得到它的那一刻非常简单。

于 2012-05-28T21:53:34.323 回答
2

格式化程序在渲染时调用。因此,您的所有数据都已加载到网格中。

为什么不为 ID 使用独占列(您可以通过调用 grid.setColumns 将其排除在渲染后不显示)?或者更好的是,使用 dataView - 它已经有一个强制性的 ID 列 - 您可以使用它来编辑/删除。

希望这可以帮助!

于 2012-05-25T19:59:55.683 回答
0

我在我的 slickgrid 分支中推送了一个提交,以向方法格式化程序添加一个新的参数元数据,它允许传递列元数据并在格式化程序方法中使用元数据。

https://github.com/Francks11/X-SlickGrid/commit/b2e14e6cb169de6059757434e7db458a997320b3

    function DoubleFormatter(row, cell, value, columnDef, dataContext, metadata) {

    var formattedValue = parseFloat( value ).toFixed(3);

    return isNaN( formattedValue ) ? "" : formattedValue;
}
于 2015-06-18T08:43:26.147 回答