Question

我正在使用kendo网格和我的Kend网格中的一个列，我正在使用工具提示。现在，经过一些修补，我发现要正确显示工具提示，我需要覆盖overflow类上的k-grid td属性。所以我只是说了

 k-grid td {
                overflow:visible
            }

在我的HTML和繁荣中我的工具提示已修复。但是，它允许其他列溢出，这明显搞砸了我的网格。所以我意识到我需要一种方法来基本上说override k-grid td但是只有这一栏。我正在使用Angular的Kendo Grid，我的字段定义如下所示

 {
                            field: "StateString",
                            title: "State",
                            width: "120px",                                                   

                        }

我应该在代码中更改什么才能为此列重写k-grid-td的溢出属性？

Answer 1

嗯，事实证明我不需要做任何想要解决这个问题的事情。此功能内置于Kendo-Grid。我刚刚添加了一个名为attributes的配置项来解决这个问题：

                   {
                        field: "StateString",
                        title: "State",
                        width: "120px",
                        encoded: true,                           
                        attributes: {
                            "class": "table-cell",
                            style: "overflow: visible;"
                        }
                    }

Answer 2

您需要使用自定义行模板，例如this demo。为相应的td类提供能够并且仅将样式应用于该列。

Answer 3

这是基于值的动态更改单元格（td）样式。我尝试根据属性设置td样式。但到目前为止，我发现的是通过模板改变td内部div格式的解决方案。有时我们需要处理td本身。

对于一列中的静态td样式，您可以使用所选答案，但对于基于列值的动态更改的td样式，您无法使用所选答案。

根据内容更改td样式的技巧：

使用单元格模板更改td内的div样式。
在网格数据绑定事件中。使用jquery使用parent（）为td指定新样式。

样本数据绑定功能：

function onGridDataBound() {
        //need to change cell class here, we cannot access cell from clientTemplate,
        //so we do it here after grid is bound with data and template
        $(".colorClass.btn-primary").parent().addClass("btn-primary");
        $(".colorClass.btn-danger").parent().addClass("btn-danger");

        //".colorClass.btn-danger" and ".colorClass.btn-primary" are the style we set in our cell template based on value
    }

如何为一列设置k-grid td BUT的样式？

3 个答案: