4

经过一段时间的研究，尝试在剑道网格表中隐藏一个指定列

使用这个

 $('#grid .k-grid-content table tr td:nth-child(8),th:nth-child(8)').toggle();

在没有帮助的情况下，有人有想法吗？

我要隐藏的列绑定到

              { 
                field: "CreatedDate",
                width: 20,
                title: "Create Date",
                type: 'date',

                template: '#= kendo.toString(CreatedDate,"MM/dd/yyyy") #'
            }

[编辑]

$('#grid div.k-grid-header-wrap th:nth-child(4)').toggle()
$('#grid div.k-grid-content td:nth-child(4)').toggle()

只能隐藏标题..但不能隐藏整个列，仍然需要帮助！

4

3 回答 3

27

假设#grid 已经绑定为剑道网格，您可以使用hideColumn 函数：

var grid = $("#grid").data("kendoGrid");
grid.hideColumn("CreatedDate");

这将隐藏标题和数据列。当您还需要显示列时，还有一个showColumn 函数。

于 2012-10-20T06:40:02.777 回答
1

试试这个：

$('#grid div.k-grid-header-wrap th:nth-child(4)').toggle();
$('#grid div.k-grid-content td:nth-child(4)').toggle();

或（组合成一个选择器）：

$('#grid div.k-grid-header-wrap th:nth-child(4), #grid div.k-grid-content td:nth-child(4)').toggle();

Kendo UI Grid 显然将表格分解为如下结构：

<div id="grid">
    <div class="k-grouping-header"></div>
    <div class="k-grid-header">
        <div class="k-grid-header-wrap">
            <table cellspacing="0">
                <colgroup>
                    <col />
                </colgroup>
                <thead>
                    <tr>
                        <th></th>
                    </tr>
                </thead>
            </table>
        </div>
    </div>
    <div class="k-grid-content">
        <table class="k-focusable" cellspacing="0">
            <colgroup>
                <col />
            </colgroup>
            <tbody>
                <tr data-uid="5f65ad8c-601d-4700-a176-23be2d33fc76">
                    <td></td>
                </tr>
            </tbody>
        </table>
    </div>
    <div class="k-pager-wrap k-grid-pager k-widget" data-role="pager">
    </div>
</div>

由于表头和表体位于不同的div元素中，因此您需要两个选择器来获取它们。

于 2012-10-20T00:09:18.723 回答
1

我根据屏幕大小显示或隐藏特定列。
当屏幕小于 X 时，表达式为真。

   hidden: ($(window).width() < 1350)

（在列部分定义）

columns: [{
    field:  "Answers",
    title:  "Answers",
    width:  35,
    hidden: ($(window).width() < 1350)
},{
    ...
于 2013-11-11T13:05:30.647 回答